javascript Dom总结

1.数组
var arr = array();
可以指明个数，也可以不用指明，或者直接填写参数使用“,”隔开
或者直接使用[]声明， var arr = ["nane",0,false]
同时也可以这样
arr["name"] = 0; //其实更像对象
使用字符串做索引
使用[]作索引来取值或者赋值
2.对象
var o = object();
o.name = "john";
o.age = 24;
或者
var o = {name:"name",age:24};
可以包含方法
使用new创建新的实例

3.var关键字可以设定作用域，如果不使用var则视为全局变量
尽量使用var声明每个变量

4.对象：
自定义对象
javascript内置对象：Data，Array等
document宿主对象（浏览器提供）：form image等

5.Dom与Dom方法 Document Object Mode
(Bom对象：window对象：window.open和window.blur方法)

dom文档就是一颗节点树（父辈，兄弟节点，孩子节点）
元素节点，文本节点和属性节点

元素节点：Dom的原子 <p>等
文本节点：直接或间接包含在元素节点中的值 <p>文本节点</p>
属性节点：id，name等包含在起始标签中的属性

CSS重点简介：
css继承：子元素会继承父元素的样式

1.getElementById(id)
2.getElementByTagName(tag) 标签数组 可以使用通配符
3.getElementByClassName(classname) 根据类型获取元素
4.getAttribute(attribute) 只能使用节点对象来调用！！！！！
5.setAttribute(attribute,value)

typeof探测或者的内容的数据类型
调用以下函数的可以是document，也可以是document的节点对象
var shopping = document.getElementById(id);
var item = shopping.getElementByTagName("*");

Dom：先加载静态文档，再动态刷新，动态刷新不影响静态文档的内容！！
再页面刷新不需要浏览器刷新

可以使用 getElementByTagName("*")遍历所有的标签，再配合其他方法匹配适应的标签来作批量处理

使用setAttribute和使用"."作用一样
区别就是setAttribute是第一级Dom规范组成部分，可以改变任意节点的属性，可移植性好。

事件处理函数
onclick(点击) onmouseover(悬停触发) onmouseout(离开触发)
onmouseup(鼠标按下) onmousedown(鼠标抬起)
this指向当前标签
<a>标签与onclick一起用时，先执行onclick事件，然后反馈给事件onclick函数，然后执行链接行为，如果希望不执行链接行为，则加上return false阻止这一默认行为
<a href="xxxx.html" onclick="show();return false"></a>

Dom节点的新属性 node.xxx
childNodes:
返回该元素下所有子元素的数组，可以使用length得知长度
几乎所有的东西，甚至空格与换行符都可以解释为节点，因此使用nodeType区分节点类型

nodeType
分12种,常用的3种
元素节点的nodeType=1
属性节点的nodeType=2
文本节点的nodeType=3

nodeValue 元素的文本节点
<p id="pValue">123</p>
var node = document.getElementById("pValue");
node.chirdNode[0].nodeValue; //输出 123
注意：p并没有nodeType(为空)的值，因此p的第一个孩子节点（文本节点）拥有该属性的值，

fristChild：等同于 node.childNode[0]
lastChild:等同于 node.childNode[node.childNode.length-1]

平稳隐退:如何在禁用了javascript的浏览器执行重要的javascript脚本？
widow.open(url,name,parme) //第三个浏览器窗体参数
javascript伪协议：通过一个链接来调用javascript
function show(){
window.open(...);
}
<a href="javascript:show()"></a> //老浏览器会失败，禁用了javascript的浏览器会什么都不做
<a href="#" onclick="show()"></a> //同上
<a href="xxx.html" onclick="show(this.href);return false"></a>

将js与dom文档分离 在脚本中添加event函数

window.onload函数与addLoadEvent（funName）函数

onkeypress键盘触发

Dom文档与web文档 web文档使用"."更简短一点

document.creatElement("p")创建一个元素节点p
document.creatTextNode("sss") 创建一个文本节点
node.appendChild(child) 插在node节点后面成为一个孩子节点

parentElement.insertyBefore(newElement,targetelement)将新元素插入到现有元素的前面
parentElement即 targetElement.parentNode

1.依赖于XMLHttpRequest对象
创建一个XMLHttpRequest对象 不同的浏览器有不同的创建方式

function getHttpObject(){
    if(typeof XMLHttpReques ==  "undefined"){
        XMLHttpReques = function(){
            //IE
            try{
                return new ActiveXobject("Msxmls.XMLHttp");
            }catch(e){}
        }
        return new XMLHttpReques;
    }
}

2.XMLHttpReques对象方法
open方法:指定服务器要访问的文件，指定访问类型以及同步异步标记

function getNewContent(){
    var request = getHttpObject();
    if(request){
        request.open("get","text.txt",true)；
        request.onreadystatechange = function(){
            //处理响应 0未初始化  1正在加载 2加载完毕 3正在交互 4表示完成
            if(request.readyState == 4){
                var para = document.createElement("p");
                var txt = document.createTextNode(request.responseText);
                para.appendChild(txt);
                document.getElementById("new").appendChild(para);
            }
        };
        request.send(null);
    }else{
        alert("不支持ajax");
    }
}
addLoadEvent(getNewContent);

request.responseText 服务器返回文本格式的字符串
request.responseXML 返回用于保存在Content-Type头部中的 text/xml数据