本文共 5115 字，大约阅读时间需要 17 分钟。
特点：1，交互性（它可以做的就是信息的动态交互）2，安全性（不允许直接访问本地硬盘）3，跨平台性（只要可以解释js的浏览器都可以执行，和平台无关）使用方式：1：在head或body使用script标签 <script type="text/javascript"> alert("在吗") </script>2，使用script标签引入单独的Javascript代码文件<script type="text/javascript" src="1.js"></script> 注意： 但是功能只能用一个（意思要么执行标签里面的代码，要么执行js文件的代码）3，JavaScript的变量类型： 数据类型：number 字符串类型：string 对象类型：object 布尔类型：boolean 函数类型：function 特殊的值： undefined： 未定义，所有js变量未赋予初始值的时候，默认值都是undefined null： 空值 NAN： 全称：Not a Number。 非数字。非数值 JS的定义变量格式： var 变量名; var 变量名=值; 例子： <script type="text/javascript"> var i; alert(i) i=12; alert(typeof(i)) </script> 返回NAN <script type="text/javascript"> var i=12; var j="asd"; alert(i*j); </script> 4，关系运算符 <script type="text/javascript"> var i=12; var j="12"; alert(i==j);//true alert(i===j);//false </script>5，数组: 数组会根据最大下标进行扩容 <script type="text/javascript"> var arr=[]; arr[0]=12; arr[2]="abc" alert(arr.length); for(var i=0;i<arr.length;i++){ alert(arr[i]); } </script>6，函数： 可以使用function关键字来定义函数，也可以var 函数名=function...... 使用格式如下： function 函数名(形参列表){ 函数体 } 例： <script type="text/javascript"> function f() { alert("在吗") } f();//记得要调用函数 </script> 在JS中，如果要返回值，直接return返回值即可 <script type="text/javascript"> function f(a,b) { result=a+b; return result; } alert(f(1,2)) </script>7，重载 不允许重载；如果两个函数名一样，直接覆盖上一次的定义8，隐形参数arguments（只在function函数内） 就是在function函数中不需要定义，但却可以直接用来获取所有参数的变量。 <script type="text/javascript"> function f() { alert(arguments[0]); alert(arguments[1]); alert(arguments.length) } f(1,2,3) </script>9，对象 Object形式的自定义对象，也可也用{}形式自定义对象： {}形式定义自定义对象： var 变量名={ 属性名:值, 属性名:值 } <script type="text/javascript"> var a=new Object(); a.name="Tom" a.age=12; alert(a.name+"-----"+a.age); </script>10,事件 常用事件： onload： 加载完成 页面加载完成之后，常用于做页面js代码初始化 onclick：单击事件 常用于按钮点击响应操作 onblur： 失去焦点 常用于输入框失去焦点后验证其输入内容是否合法 onchange：内容改变 常用于下拉列表和输入框内容发生改变后操作 onsubmit：表单提交 常用于表单提交前，验证所有表单项是否合法 事件注册： 静态注册：通过html标签的事件直接赋予事件响应后的代码 <body onload="alert('静态注册事件')"> </body> 动态注册：先通过js标签得到标签的dom对象，然后通过dom对象.事件名=function(){}这种形式赋予事件响应后的代码 1，获取标签对象 2，标签对象.事件名=function(){} <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> window.onload=function () { var btn = document.getElementById("btn"); alert(btn); } </script> </head> <body> <button id="btn">按钮</button> </body> getElementsByName练习: <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> function oncheck() { var one = document.getElementsByName("test"); for(var i=0;i<one.length;i++){ one[i].checked=true; } } </script> </head> <body> <input type="checkbox" name="test" checked="false" value="1"> <input type="checkbox" name="test" checked="false" value="2"> <input type="checkbox" name="test" checked="false" value="2"> <button onclick="oncheck()"></button> </body>注意：document对象的三个查询方法，如果有id属性，优先使用getElementsById方法进行查询 如果没有id属性，则优先使用getElementsByName方法进行查询 如果没有name和id属性，则最后按标签查询getElementsByTagName11，节点的常用属性和方法： 方法： getElementsByTagName()：获取当前节点的指定标签名孩子节点 appendChild(onChildNode)：可以添加一个子节点，onChildNode是要添加的孩子节点 属性： childNodes：获取当前节点的所有子节点 firstChild：获取当前节点的第一个子节点 lastChild：获取当前节点的最后一个子节点 parentNode：获取当前节点的父节点 nextSibling：获取当前节点的下一个节点 previousSibling：获取当前节点的上一个节点 className：用于获取或设置标签的class属性值 innerHTML：表示获取/设置起始标签和结束标签中的内容 innerTest：表示获取/设置起始标签和结束标签中的文本转载地址：http://nhca.baihongyu.com/