标签：
在浏览一下客户端代码时，经常会遇到javascript脚本，系统的学习一下对以后更深入了解客户端很有好处。
改进设计
验证表单
检测浏览器
创建cookies等
document.write("<h1>This is a heading</h1>");
x=document.getElementById("demo") //找到元素
x.style.color="#ff0000"; //改变样式
if isNaN(x) {alert("Not Numeric")};
<script> 和 </script> 之间的代码行包含了 JavaScript
一般情况下，函数与事件紧密相关。
我们需要在某个事件发生时执行代码，比如当用户点击按钮时。
如果我们把 JavaScript 代码放入函数中，就可以在事件发生时调用该函数。
通常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。
外部 JavaScript 文件的文件扩展名是 .js。
<!DOCTYPE html> <html> <body> <script src="myScript.js"></script> </body> </html>
person=new Object(); person.firstname="Bill"; person.lastname="Gates"; person.age=56; person.eyecolor="blue";
function myFunction(10. 运算符，if-else, switch, for, while, break, continue语法，类似于c语言var1,var2) { 这里是要执行的代码 }
<script>
function myFunction()
{
try
{
var x=document.getElementById("demo").value;
if(x=="") throw "empty";
if(isNaN(x)) throw "not a number";
if(x>10) throw "too high";
if(x<5) throw "too low";
}
catch(err)
{
var y=document.getElementById("mess");
y.innerHTML="Error: " + err + ".";
}
}
</script>
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}
var x=document.getElementById("intro");
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
3. 如需改变 HTML 元素的内容，语法：
document.getElementById(id).innerHTML=new HTML
<h1 onclick="this.innerHTML=‘谢谢!‘">请点击该文本</h1>
<body onload="checkCookies()">
5. 当输入字段被改变时
onchange 事件
<input type="text" id="fname" onchange="upperCase()">
onmousedown、onmouseup 以及 onclick 事件
<div onmousedown="mDown(this)" onmouseup="mUp(this)" style="background-color:green;color:#ffffff;width:90px;height:20px;padding:40px;font-size:12px;">请点击这里</div>
var para=document.createElement("p");
var node=document.createTextNode("这是新段落。");
para.appendChild(node);
var element=document.getElementById("div1");
parent.removeChild(child);
constructor
var mycars=new Array("Saab","Volvo","BMW")
如何使用 sort() 方法从数值上对数组进行排序。
5. Math对象
round() 四舍五入
max(), min()
random() 返回介于0-1的随机数
floor(), ceil()
常数：
Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E
6. js 正则表达式
test：
检索字符串中的指定值。返回值是 true 或 false。var patt1=new RegExp("e");
document.write(patt1.test("The best things in life are free"));
exec：
返回值是被找到的值。如果没有发现匹配，则返回 null。var patt1=new RegExp("e");
document.write(patt1.exec("The best things in life are free"));
compile:
用于改变正则表达式的值
var patt1=new RegExp("e");
document.write(patt1.test("The best things in life are free"));
patt1.compile("d");
document.write(patt1.test("The best things in life are free"));
1. window 高度，宽度，document对象，表示浏览器窗口属性
方法：
open(), close(), moveTo(), resizeTo()
2. screen
screen.availWidth - 可用的屏幕宽度
screen.availHeight - 可用的屏幕高度
3. location
location.href 属性返回当前页面的 URL。
location.pathname 属性返回 URL 的路径名。
location.assign() 方法加载新的文档。
4. history
history.back() - 与在浏览器点击后退按钮相同
history.forward() - 与在浏览器中点击按钮向前相同
5. navigator
包含浏览器信息
如 appCodeName, appName, appVersion, cookieEnabled, platform, userAgent, systemLanguage等
6. 消息框
alert() 警告框
confirm() 确认、取消框
prompt() 提示框
7. 计时功能， 毫秒为单位
setTimeout()
未来的某时执行代码
clearTimeout()
取消setTimeout()
8. cookie
document.cookie
创建、存储、获取、检查cookie
实例 http://www.w3school.com.cn/tiy/t.asp?f=jseg_cookie_username
jQuery是js著名的一个库
引用 jQuery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。
AJAX 是一种用于创建快速动态网页的技术。
XMLHttpRequest 是 AJAX 的基础。
XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
variable=new XMLHttpRequest();
XMLHttpRequest 对象用于和服务器交换数据。
如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法
1. GET请求
xmlhttp.open("GET","demo_get.asp",true);
xmlhttp.send();
2. POST请求
xmlhttp.open("POST","ajax_test.asp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");
3. 响应
如需获得来自服务器的响应，请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
responseText 属性返回字符串形式的响应：
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
如果来自服务器的响应是 XML，而且需要作为 XML 对象进行解析，请使用 responseXML 属性
4. XHR事件
onreadystatechange 的描述
http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_onreadystatechange.asp
| 属性 | 描述 |
|---|---|
| onreadystatechange | 存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。 |
| readyState |
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
|
| status |
200: "OK" 404: 未找到页面 |
在 onreadystatechange 事件中，我们规定当服务器响应已做好被处理的准备时所执行的任务。
当 readyState 等于 4 且状态为 200 时，表示响应已就绪：
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
标签：
原文地址：http://blog.csdn.net/viewcode/article/details/43954569
