DOM文档对象模型

　　　　<div title="我是属性">我是文本</div>

　　　　　　　　function getStyle(el,styleStr){
      　　　　　　return el.currentStyle ? el.currentStyle[styleStr] : getComputedStyle(el)[styleStr];//兼容IE
　　　　　　　　}

 　　　　　　var div1 = node.getElementByTagName("div")
　　　　　　 var ul1 = div1.getElementByTagName("ul");//获取div下面的所有ul的标签，获取的是一个数组，ul1[i]或者ul1.item(i);也可以

             function elementByClassName(parent,classStr){
                 var child = parent.getElementByTagName("*");//*代表所有类型的节点
                 var getE = [];//用来记录符合的元素节点数组
                 for(i=0;i<child.length;i++){
                     if(child[i].className == classStr){
                     getE.push(child[i]);
                 　　 }
                 }
                 return getE;
              }

         var div1 = document.getElementById("div1");
         div1.className;
         div1.getAttribute("class");//两个是一样的,但是一个是通过className,一个是通过class
         div1.className = "sdf";
         div1.setAttribute("class","dsf");

　　　　　　<div id="div1"><em>ff</em>文本<strong>sdfd</strong></div>

           var oDiv = document.getElementById("div1");
           alert(oDiv.childNodes[0].nodeName);//返回EM
           alert(oDiv.childNodes[0].nodeType);//返回1
           alert(oDiv.childNodes[0].nodeValue);//返回null
 
           alert(oDiv.childNodes[1].nodeName);//返回#text
           alert(oDiv.childNodes[1].nodeType);//返回3
           alert(oDiv.childNodes[1].nodeValue);//返回 文本    

　　　　alert(oDiv.firstChild.nodeName);//返回EM

　　　　alert(oDiv.lastChild.nodeName);//返回strong

　　　　<div id="div1">
           <em>ff</em>
           文本
           <strong>sdfd</strong>
       </div>

       function defineSpaceNode (nodes){
           var result = [];//先定义一个数组，将结果返回
           for (i = 0; i < nodes.length; i++){//遍历节点
               if(nodes[i].nodeType == 3 && /^\s+$/.test(nodes[i].nodeValue)){//如果节点即是文本节点又是空白字符返回true
                   continue;//结束本次循环，开始下次循环
               }
               result.push(nodes[i]);//如果结果false，那么将结果加入数组返回
            }
            return result;
       }

          function removeSpaceNode (parent){
             var nodes = parent.childNodes;
             for (i = nodes.length - 1; i <= 0; i--){//需要倒序删除
                 if(nodes[i].nodeType == 3 && /^\s+$/.test(nodes[i].nodeValue)){
                     parent.removeChildNodes(nodes[i]);
                 }
             }
          }
          var oDiv = document.getElementById("div1");
          var divNodes = defineSpaceNode(oDiv.childNodes);//识别掉空白节点赋值给divNodes
          alert(divNodes.length);//返回3

                var nodeSpan = document.createElement("span");//创建一个span节点
                var oText = document.createTextNode("文本内容");//创建一个文本节点
                nodeSpan.appendChild(oText);//span带上了文本
                oDiv.appendChild(nodespan);//将span插入最后

                function creatElementWithTxt(el,txt){
                    var nodeSpan = document.createElement(el);//创建一个span节点
                    var oText = document.createTextNode(txt);//创建一个文本节点
                    return nodeSpan.appendChild(oText);//span带上了文本
                }

                <div><em></em><strong></strong></div>

                var oSpan = creatElementWithTxt(span,"文本");
                var oEm = document.getElementByTagName("em")[0];//找到要插入的第一个元素节点
                oEm.parentNode.insertBefore(oSpan,oEm);//在em之前插入一个带文本的span

        function insertAfter(newNode,oldNode){
           var parent = oldNode.parentNode;
           if(oldNode == parent.lastChild){如果是最后一个节点
               parent.appendChild(newnode);
           }else{
               parent.insertBefore(newNode,oldNode.nextSibling);
           }
       }

　　function elementByClassName(parent,classStr){
       var child = parent.getElementsByTagName("*");//*代表所有类型的节点
       var getE = [];//用来记录符合的元素节点数组
       for(i=0;i<child.length;i++){
            if(child[i].className == classStr){//遍历节点的className查找需要的
               getE.push(child[i]);
            }
       }
       return getE;
   }

            function $(elStr){
                switch(elStr[0]){
                    case "#"://判断是否是ID
                        return document.getElementById(elStr.substring(1));
                        break;
                    case "."://className
                        return elementByClassName(document,elStr.substring(1));
                        break;
                    default:
                        if(elStr.substring(0,5) == "name="){//name
                            return document.getElementsByName(elStr.substring(5));
                    　　}
                    　　else{
                      　　  return document.getElementsByTagName(elStr);//tagName
                    　　}
                    　　break;
           　　 }
       　　 }

　　 　　　　<div name = "divName">111</div>
    　　　　<div class = "divClass">222</div>
    　　　　<div class = "divClass">333</div>
    　　　　<div id = "divId">444</div>

 　　　　　　window.onload = function(){
            　　alert($("#divId").innerHTML);
            　　alert($(".divClass").length);
            　　alert($(".divClass")[1].innerHTML);
            　　alert($("name=divName")[0].innerHTML);
            　　alert($("div").length);
            　　alert($("div")[1].className);
        　　}