第二章 js相关

一. js基本语法

1. 变量的定义
   （1）必须以字母开头，也可以以$和_符号开头，大小写敏感
   （2）使用var关键字来声明变量
   （3）可以在一条语句中声明很多变量
   （4）未使用值来声明的变量，值是undefined
   （5）如果重新声明js变量，变量的值不会丢失
   var a = 1; var a;//a还是1

2. 数据类型
   字符串、数字、布尔、数组、对象、Null、Undefined
   js变量均为对象。当您声明一个变量时，就创建了一个新的对象。

3. 创建对象
   (1) new Object()
   (2) 使用对象构造器
   (3) 使用JSON对象，两个花括号

4. 函数
   定义方法
   无默认值
   函数内部声明的变量（使用var）是局部变量
   在函数外声明的变量是全局变量，所有脚本和函数都能访问

5. 运算符
   +号表示字符串的拼接

6. 流程控制
   else if 需要分开

7. js内置对象
   http://www.w3school.com.cn/js/js_datatypes.asp
   Number
   var pi = 3.14;
   var myNum = new Number(value);
   var myNum = Number(value);

String
var str = ‘this is a string’;
var str = new String(s);
var str = String(s);

Boolean
var bool = true;
var bool = new Boolean(value);
var bool = Boolean(value);

Array
var arr = new Array();
var arr = new Array(size);
var arr = new Array(e1,e2,e3);
js中不允许关联数组，如果需要关联数组需要定义json对象

Date
var date = new Date();

Math
var pi_value = Math.PI;
Math.sqrt(15);

RegExp
/pattern/attributes
不要加引号
new RegExp(pattern,attributes)

Window对象
Window Navigator Screen History Location

DOM对象
Document Element Attr Event

8 jQuery基础
jQuery选择器
基本选择器、层次选择器、过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器

jQuery事件
$(“button”).click(function(){…})

jQuery效果
$(“p”).show()

jQuery DOM操作
属性、值、节点、CSS、尺寸

二. ajax基本

1. AJAX基本概念
   Asynchronous JavaScript and XML
   通过在后台与服务器进行少量数据交换，AJAX可以使网页实现异步更新

2. AJAX工作原理
   XMLHttpRequest 是AJAX的基础
   XMLHttpRequest 用于在后台与服务器交换数据

3. XMLHttpRequest对象请求
   open(method,url,async)
   send()

4. XMLHttpRequest对象响应
   responseText
   responseXML
   onreadystatechange
   readyState:0(请求未初始化)，1（服务器连接已经建立），2（请求已接收），3（请求处理中），4（请求已完成，且响应已就绪）
   status:200 ,400

5. 常用方法
   $(ele).load(),$.ajax(),$.get(),$.post(),$.getJSON(),$.getScript()

6. 操作流程

1.创建XMLHttpRequest对象
function createXMLHTTPRequest() {     
 //1.创建XMLHttpRequest对象     
 //这是XMLHttpReuquest对象无部使用中最复杂的一步     
 //需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同的代码     
 var xmlHttpRequest;  
 if (window.XMLHttpRequest) {     
     //针对FireFox，Mozillar，Opera，Safari，IE7，IE8     
    xmlHttpRequest = new XMLHttpRequest();     
     //针对某些特定版本的mozillar浏览器的BUG进行修正     
     if (xmlHttpRequest.overrideMimeType) {     
         xmlHttpRequest.overrideMimeType("text/xml");     
     }     
 } else if (window.ActiveXObject) {     
     //针对IE6，IE5.5，IE5     
     //两个可以用于创建XMLHTTPRequest对象的控件名称，保存在一个js的数组中     
     //排在前面的版本较新     
     var activexName = [ "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];     
     for ( var i = 0; i < activexName.length; i++) {     
         try {     
             //取出一个控件名进行创建，如果创建成功就终止循环     
             //如果创建失败，回抛出异常，然后可以继续循环，继续尝试创建     
            xmlHttpRequest = new ActiveXObject(activexName[i]);   
            if(xmlHttpRequest){  
                break;  
            }  
         } catch (e) {     
         }     
     }     
 }     
 return xmlHttpRequest;  
}     



2. get请求
function get(){  
    var req = createXMLHTTPRequest();  
    if(req){  
        req.open("GET", "http://test.com/?keywords=手机", true);  
        req.onreadystatechange = function(){  
            if(req.readyState == 4){  
                if(req.status == 200){  
                    alert("success");  
                }else{  
                    alert("error");  
                }  
            }  
        }  
        req.send(null);  
    }  
}  

3. post请求
   function post(){  
    var req = createXMLHTTPRequest();  
    if(req){  
        req.open("POST", "http://test.com/", true);  
        req.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=gbk;");     
        req.send("keywords=手机");  
        req.onreadystatechange = function(){  
            if(req.readyState == 4){  
                if(req.status == 200){  
                    alert("success");  
                }else{  
                    alert("error");  
                }  
            }  
        }  
    }  
}