注释：
/*多行 注释*/ //单行注释
变量：
//变量均为对象，常用类型：String、Number、Boolean、Array、Object var value = "hello"; //变量声明只能用var，不能用具体类型，变量本身的类型会在声明后类型推断 value = 9; //而且类型推断，还具有动态类型 document.write(value);
使用id表示元素，再访问该元素：
<head> <script> document.getElementById("test").innerHTML="test"; </script> </head> <body> <p id="test">操纵html元素</p> <!--将js放在最后，可以确保在所有元素创建完毕之后，再执行脚本--> <script> document.getElementById("test").innerHTML="test"; </script> </body>
由于js可以用document.write向页面写入含有标签的文本，但是又可以通过标签的id的属性来改变其值，所以这就是写入动态的文本。
//document.write('<p id="test">hello</p>'); //可以在字符串中使用引号，只要不匹配包围字符串的引号即可 document.write("<p id='test'>hello</p>"); document.getElementById("test").innerHTML = "test";
数字(使用科学记数法)：
//所有 JavaScript 数字均为 64 位(2^64，8B) var y = 123e5; // 123 * 10^5 = 12300000 var z = 123e-5; // 0.00123 var a = 0377; //八进制(前缀为0) var b = 0xFF; //16进制
日期对象Date：
//Date 对象自动使用当前的日期和时间作为其初始值 var fullDate = new Date(); //设定指定时间 fullDate.setFullYear(2008, 11, 20); //年，月(0-11 — 11:12月)，日 //仅设置日期：如果增加天数会改变月份，那么Date对象会自动完成转换 fullDate.setDate(fullDate.getDate() + 5); document.write(fullDate + "<br />"); //获得时分秒 document.write(fullDate.getHours() + "<br />"); //分、秒都是同样的做法
创建数组：
var car1 = new Array(); car1[0] = "hello"; car1[1] = 123; // or condensed array var car_2 = new Array(3); var car2 = new Array("Audi", "BMW", "Volvo"); // or literal array var car3 = ["Audi", "BMW", "Volvo"];
逻辑对象Boolean：
如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN，那么对象的值为 false；其他情况为true。
算数对象Math：
//使用内置的Math对象 document.write(Math.round(4.4) + "<br />"); //四舍五入 document.write(Math.random() + "<br />"); //随机小数：0到1 document.write(Math.floor(Math.random() * 100) + "<br />"); //随机小数*扩大倍数M，再通过下舍入函数floor生成最后的随机数：0到M document.write(Math.max(1, -1) + "<br />" + Math.min(1, -1) + "<br />"); //比大小
正则对象RegExp：
//RegExp对象常用3个方法：test、exec、compile var pattern = new RegExp("e"); document.write(pattern.test("hello") + "<br />"); //输出bool值 document.write(pattern.exec("hello") + "<br />"); //找到则返回pattern(模式)的值，否则为null //第二个参数: exec方法会改变：找到第一个模式(pattern)，并记录位置；如果再次执行exec，则从上次的位置后检索 var pattern1 = new RegExp("e", "g"); do { var result = pattern1.exec("hello"); document.write(result); } while (result != null); document.write("<br />"); //compile方法用于改变RegExp，如改变模式(pattern)、增删第二个参数 pattern.compile("h"); document.write(pattern.test("hello") + "<br />");
创建自定义对象：
直接创建实例、对象构造器（函数）：
//直接创建实例 person1 = new Object(); person1.age = 56; document.write(person1.age + "<br />"); //写法二 var person2 = { //属性，以键值对形式存在 firstname: "Bill", lastname: "Gates", id: 5566 }; document.write(person2.lastname + "<br />"); document.write(person2["lastname"] + "<br />");
//使用函数定义，对象构造器，再实例化 function person3(age) { this.age = age; } var boy = new person3(10); document.write(boy.age + "<br />"); //此外，对已存在的对象(不管是通过哪种方式创建的)，还可以随时添加新的属性、方法 boy.firstname = "Bill"; document.write(boy.firstname + "<br />");
添加方法：
//添加方法 function hello() { alert("hello"); } function person() { this.hello = hello; } var girl = new person(); girl.hello(); //对已经存在的对象，添加新的方法 document.hello = hello; document.hello();
遍历一个对象的所有属性：
var person = { fname: "Bill", lname: "Gates", age: 56 }; for(x in person) { document.write(x + ": " + person[x] + "<br />"); //这里不能写成person.x }
函数：
全局变量：在函数外的变量为全局，任何脚本都能用。
数字+字符串：会将数字当作字符串处理。
for循环：
var person={fname:"Bill",lname:"Gates",age:56}; for (x in person) { txt = txt + person[x]; }
抛出自定义异常：
function CustomException() { try { throw "customException"; } catch(err) { alert(err); } } CustomException();
在数据被发送到服务器之前，进行表单验证。
当网页被加载时，浏览器会创建页面的DOM模型树，即构造对象之间的树形关系(模型)：
找到HTML元素：通过id、标签名、class：
<p id="test" class="test">test文本</p> <script> var x = document.getElementById("test"); var y = document.getElementsByTagName("p"); //这个对象中的所有p元素 var z = document.getElementsByClassName("test"); document.write("id: " + x.innerHTML + "<br />"); document.write("TagName: " + y[0].innerHTML + "<br />"); document.write("class: " + z[0].innerHTML + "<br />"); </script>
改变HTML属性：
<img id="test" src="1.png" />
<script>
//document.getElementById(id).attribute = new value
var x = document.getElementById("test");
x.src = "2.png";
</script>
改变 HTML 元素的样式 (CSS)：
<p id="test">Hello</p>
<script>
//document.getElementById(id).style.property = new style
var x = document.getElementById("test");
x.style.color = "#FF0000";
</script>
<h1 id="id1">Header</h1>
<button onclick="document.getElementById('id1').style.color = '#FF0000'">点击测试</button>
处理 HTML DOM 事件：
<h1 onclick="this.innerHTML='谢谢!'">请点击该文本</h1>
<h2 id="test2">Hello</h2>
<script>
var x = document.getElementById("test2");
x.onclick = function () { changeText() };
function changeText()
{
x.innerHTML = "Thanks";
}
</script>
onload可用来处理cookie等事务：
<script> document.onload = checkCookies(); function checkCookies() { //是否使用Cookies if (navigator.cookieEnabled == true) alert("Enabled cookies"); } </script>
onchange事件：
<!--在点击页面中的其他地方后（离开输入字段），会触发onchange事件-->
<input id="test" type="text" onchange="TextChange()" />
<script>
function TextChange()
{
var x = document.getElementById("test");
x.value = x.value.toUpperCase();
}
</script>
鼠标相关操作：
<p onmouseover="mOver(this)" onmouseout="mOut(this)">测试文本</p>
<p onmousedown="mDown(this)" onmouseup="mUp(this)">测试文本</p>
<script>
//放上去，又拿开
function mOver(obj)
{
obj.innerHTML = "鼠标放在了这里";
}
function mOut(obj)
{
obj.innerHTML = "鼠标离开了这里";
}
//点击下去，又松开，就点完了（有了down、up，就不用click了）
function mDown(obj)
{
obj.innerHTML = "点击不放";
}
function mUp(obj)
{
obj.innerHTML = "松开";
}
</script>
添加或删除 HTML 元素：
<!--添加新元素：创建新元素，再将新元素加入某个元素--> <div id="div1"> <p>段落</p> </div> <script> //创建 var p = document.createElement("p"); var text = document.createTextNode("新段落"); p.appendChild(text); //添加 var element = document.getElementById("div1"); element.appendChild(p); </script>
类似的，删除：
<div id="div1"> <p id="p1">段落1</p> <p id="p2">段落2</p> </div> <script> //通过这个元素的父亲，来删掉它 var child = document.getElementById("p1"); child.parentNode.removeChild(child); //child.parentElement.removeChild(child); //易懂的写法 //var child = document.getElementById("p1"); //var parent = document.getElementById("div1"); //parent.removeChild(child); </script>
创建三种消息框——警告框、确认框、提示框：
//警告框alert：下面换行 alert("hello" + " " + "world"); //应该用concat方式，写在一起达不到效果 //确认框：往往需要根据返回值，来确定选择结果 var result = confirm("choose"); if (result == true) { alert("OK"); } else { alert("no"); } //提示框：往往用于，进入一个页面之前提示用户输入某些值：prompt("提示文本","默认值")。点击确认后，返回值为输入框的值；取消，为null document.write(prompt("请输入姓名", "Bill Gates"));