当前位置： 首页 > news >正文

手机版网站系统网站建设和媒体渠道

news 2025/10/26 18:25:08
手机版网站系统,网站建设和媒体渠道,手机和pc合一的网站,模板网站难做seo一、JS简介JS：1、直接嵌入HTML页面。2、由浏览器解释执行代码，不进行预编译。解释型语言和编译型语言JS：解释型语言、弱类型语言Java:编译型语言、强类型语言int num 100;变量: var num 100;variable 用var来定义一个变量。变量名区分大小写…

一、JS简介

JS：

1、直接嵌入HTML页面。

2、由浏览器解释执行代码，不进行预编译。

解释型语言和编译型语言

JS：解释型语言、弱类型语言

Java:编译型语言、强类型语言

int num = 100;

变量: var num = 100;

variable 用var来定义一个变量。

变量名区分大小写，允许包含字母、数字、美元符号($)和下划线，但第一个字符不允许是数字，不允许包含空格和其他标点符号。

起有意义的名字，最重要一点就是“见名知意”。

JS不区分单引号和双引号。

<script type="text/javascript">var num1 = 3;var num2 = 5;var result = num1 + num2;console.log(result);//8var str = '10';console.log(num1 + str);//310//全局函数parseIntvar result2 = num1 + parseInt(str);console.log(result2);//13alert(result2);
</script>

二、JS数据类型

null、undefined区别：

var x;

var y;

没有初始化的变量自动取值为undefined。

如果这个变量值为null表示这个变量已经赋值了，这个值正好是null。

声明变量统一使用var声明，声明的时候变量是没有类型。

但是变量赋值之后就有类型，这个变量的类型就是这个变量值的类型。

<script type="text/javascript">//int num;//只是声明变量，没有赋值，现在的值是undefinedvar v;console.log(v);//undefinedconsole.log(typeof(v));//undefinedv = 3.14;console.log(v);//3.14console.log(typeof(v));//numberv = 'js';console.log(v);//jsconsole.log(typeof(v));//stringv = true;console.log(v); //trueconsole.log(typeof(v));//booleanv = null;console.log(v); //nullconsole.log(typeof(v));//object
</script>

三、关系运算符

全等：===

不全等：!==

判断值是不是相等 ，还有类型是不是相等。

<script type="text/javascript">var m = '3';var n = 3;if (m == n) {//值相等就可以console.log('m==n')}if (m === n) {//值相等，类型也要相等console.log('m===n')}
</script>

四、String

创建String对象有两种方式

  1. var str1 = 'hello js!';
  2. var str2 = new String('hello js!');

String属性：length

str1.length; // 9

String常用的方法：

1、大小写转换

str.toLowerCase();

str.toUpperCase();

var str = 'Hello jS!';

console.log(str.toLowerCase());//hello js!

console.log(str.toUpperCase());//HELLO JS！

2、获取指定字符：

str.charAt(index) 返回指定位置的字符

index：字符位置

console.log(str.charAt(6));//j

3、查询指定字符串出现索引

str.indexOf(findstr, [index]);

str.indexOf(findstr);

str.indexOf(findstr,index);

str.indexOf(findstr,[index])

str.lastIndexOf(findstr, [index]);

使用说明：

findstr:查找的字符串

index:开始查找的位置索引，可以省略

返回findstr在x中出现的首字符位置索引，如果没有找到则返回-1

lastIndexOf:从后面找起

4、split() 方法用于把一个字符串分割成字符串数组。

x.split(separator,howmany)

separator : 字符串或正则表达式，从该参数指定的地方分割 stringObject

howmany:指定返回数组的最大长度，可以省略

返回分割后的字符串数组

<script type="text/javascript">var str1 = 'Hello JS and Java';console.log(str1.indexOf('J'));//6console.log(str1.indexOf('JS'));//6console.log(str1.indexOf('JS', 9));//-1var str2 = 'how are you doing today';var array = str2.split(' ');console.log(array);console.log(array[0]);console.log('1:2:3:4'.split(':'));
</script>

五、Boolean

Java中条件表达式必须返回布尔类型 if() while()

2

JS中表达式可以是任意表达式

1不是0，就是非空值，表示true

NaN=Not a number

在JS里面一切表示空的值都是false，非空的值都是true。

<script type="text/javascript">console.log('-----------------')if (true) {console.log('true');}if (0) {//falseconsole.log('0');}if (!0) {//trueconsole.log('!0');}if ('') {//falseconsole.log('空字符串');}if ('abc') {//trueconsole.log('abc');}
</script>

六、Array

创建数组对象

int[] array = new int[3];

String[] array = new String[3];

var array1 = new Array();//创建一个空的数组

var array2 = new Array(7);//创建长度是7的数组

var array3 = new Array(100, 'a', true);

var array4 = [100, 200, 300];

获取数组元素的个数：length属性

<script type="text/javascript">var array1 = new Array(7);console.log(array1.length);var array2 = new Array(100, 'abc', true);console.log(array2.length);//创建一个空数组var array = new Array();array[0] = '234';console.log(array);//['234']console.log(array.length);//1array[1] = false;console.log(array);//['234', false]console.log(array.length);//2//对JS里面的数组可以不使用下标，使用push和pop向数组里面放数据和拿数据var arr = new Array();arr.push('zhangsan');console.log(arr);//['zhangsan']console.log(arr.length);//1arr.push(false);console.log(arr);//['zhangsan', false]console.log(arr.length);//2arr.push(45);console.log(arr);//['zhangsan', false, 45]console.log(arr.length);//3console.log(arr.pop());//45console.log(arr.pop());//falseconsole.log(arr.pop());//zhangsan
</script>

七、Math

parseInt()

Math.PI Math.round(3.14)

八、eval

eval('2+3') //5

eval('var x=10;var y=20;console.log(x*y);'); //200

九、JS对象

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script>var student = {name: 'zhansgan',age: 23,study: function() {console.log(this.name + '的年龄是' + this.age + '岁');}};console.log(student.name);student.study();</script>
</head>
<body>
</body>
</html>

十、DOM

dom：document object model文档对象模型

dom技术的作用：JS语言和Html标签之间沟通的一个桥梁。

为了方便JavaScript语言通过DOM操作Html比较方便，

把Html标签的内容划分为各种节点：

  1. 文档节点(document)
  2. 元素节点 也叫标签 getElementsByTagName
  3. 文本节点
  4. 属性节点 type=”text” name=”username”
  5. 注释节点

dom就是学习利用JS如何实现对Html标签增删改查。

documnet：是页面中的内置对象，内置对象简单理解就是已经new好的一个对象，对象的名字就叫document。

元素节点的获取：

document.getElementById( id属性值);

document.getElementsByTagName("标签名")；

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><input type="text" id="inputId" value="Hello"> <br><input type="button" value="点我" onclick="clickMe()"><script>function clickMe() {//console.log('clickMe');var array = document.getElementsByTagName('input');console.log(array);console.log(array[0]);console.log(array[0].value);//var inputObj = document.getElementById('inputId');//console.log(inputObj.value);}</script>
</body>
</html>

练习：

写一个5行4列的table。

inputObj.value = 23;

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title></title></head>
<body>
<table><tr><td><img src=""/></td><td colSpan="3">购物简易计算器</td></tr><tr><td>第一个数</td><td colSpan="3"><input type="text" id="num1Id"/></td></tr><tr><td>第二个数</td><td colSpan="3"><input type="text" id="num2Id"/></td></tr><tr><td><input type="button" value=" + " onclick="cal('+')"/></td><td><input type="button" value=" - " onclick="cal('-')"/></td><td><input type="button" value=" * " onclick="cal('*')"/></td><td><input type="button" value=" / " onclick="cal('/')"/></td></tr><tr><td>计算结果</td><td colSpan="3"><input type="text" id="resultId"/></td></tr>
</table><script type="text/javascript">function cal(type) {var num1 = document.getElementById('num1Id').value;var num2 = document.getElementById('num2Id').value;// '2+3'  '2-3'var result = eval(parseInt(num1) + type + parseInt(num2));var resultObj = document.getElementById('resultId');resultObj.value = result;}function cal1(type) {var num1 = document.getElementById('num1Id').value;var num2 = document.getElementById('num2Id').value;var result = 0;switch (type) {case '+':result = parseInt(num1) + parseInt(num2);break;case '-':result = parseInt(num1) - parseInt(num2);break;case '*':result = parseInt(num1) * parseInt(num2);break;case '/':result = parseInt(num1) / parseInt(num2);break;}var resultObj = document.getElementById('resultId');resultObj.value = result;}function add() {var num1 = document.getElementById('num1Id').value;var num2 = document.getElementById('num2Id').value;var result = parseInt(num1) + parseInt(num2);var resultObj = document.getElementById('resultId');resultObj.value = result;}function sub() {var num1 = document.getElementById('num1Id').value;var num2 = document.getElementById('num2Id').value;var result = parseInt(num1) - parseInt(num2);var resultObj = document.getElementById('resultId');resultObj.value = result;}function mul() {var num1 = document.getElementById('num1Id').value;var num2 = document.getElementById('num2Id').value;var result = parseInt(num1) * parseInt(num2);var resultObj = document.getElementById('resultId');resultObj.value = result;}function div() {var num1 = document.getElementById('num1Id').value;var num2 = document.getElementById('num2Id').value;var result = parseInt(num1) / parseInt(num2);var resultObj = document.getElementById('resultId');resultObj.value = result;}
</script>
</body>
</html>

十一、innerText、innerHtml

innerText 直接当成一个字符串展示

innerHtml 将内容当成html来解析

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><span id="spanId">Hello Span</span><br/><button onclick="clickMe()">点击</button><script type="text/javascript">function clickMe() {var spanObj = document.getElementById('spanId');//spanObj.innerText = '<h1 style="color: red;">innerText</h1>';spanObj.innerHTML = '<h1 style="color: red;">innerText</h1>';}</script></body>
</html>

http://www.dtcms.com/a/530348.html

相关文章：

  • 网站加速 wordpresswordpress媒体库一直转圈
  • Linux 离线迁移conda R虚拟环境教程
  • 过界女主个人做网站的班级网站的建设
  • 杭州公司网站建设套餐怎样申请建立自助网站
  • 网站备案号查询网温州论坛官方网
  • 做网站百度推广南沙网站建设公司哪家好
  • 重庆网站建设推荐网站营销推广有哪些
  • 网站控制做百度网站需不需要备案吗
  • ps制作网站网站开发文档模板下载
  • 手机站建设前端网站设计
  • 门户网站建设招投标php网站视频代码
  • 格尔木网站建设公司怎么入侵网站后台管理
  • 网站升级改造建设方案百度网站地图在线生成
  • 北京建设企业协会网站wordpress 打开慢 google
  • 创建网站投资多少网页生成应用
  • asp.net开发网站和优势网站建设】
  • 怎么计算网站开发费用如何建设自己的网站
  • 云计算网站建设郑州哪家做网站最好
  • 重庆网站建设推广优化医生做兼职有什么网站吗
  • 禅城网站制作设计室内装修app软件
  • 旅游去过的地方可做标识网站一个域名做多个网站
  • 基于ATC89C51单片机的超市临时储物柜密码锁设计
  • 汽车网站建设策划书施工企业安全管理制度
  • 怎么知道网站是php个人手机版网站建设
  • HTML 01入门：从概念到开发环境搭建与页面头部配置
  • 大酒店网站源代码郴州建设网站哪家好
  • 福州做商城网站公司网站建设人员要求
  • 安徽做公司网站哪家好wordpress hta
  • 公司设计网站应遵守哪些常理科技网站配色
  • 网站建设 利润企业网站制作公司推荐