纠结的DOM 兼容性太差

  1 var btn1 = document.createElement("input");
  2     btn1.type = "radio";
  3     btn1.name = "choose";
  4     var btn2 = document.createElement("input");
  5     btn2.type = "radio";
  6     btn2.name = "choose";
  7     var btn3 = document.createElement("input");
  8     btn3.type = "radio";
  9     btn3.name = "choose";
 10 
 11     document.body.appendChild(btn1);
 12     document.body.appendChild(btn2);
 13     document.body.appendChild(btn3);
 14 
 15     var all = document.getElementsByTagName("*");// 取不到文本节点 也取不到注释节点
 16     
 17 
 18     var images = document.images;
 19     console.log(images);
 20     /*var img = images.namedItem("mypic"); // chrome 不支持 IEff支持
 21     var img = images["mypic"];   // chrome 不支持 IEff支持
 22     alert(img);*/
 23 
 24     //alert(document.getElementById("user"));
 25     console.log(document.doctype);// IE 78 Null
 26 
 27     var xx = document.getElementById("xx");
 28     console.log("tagName", xx.tagName,"nodeName:", xx.nodeName);
 29 
 30     // .style 跟 getAttribute("style") 的差别
 31     console.log("style::", xx.style); // object
 32     console.log("getAttribute() style:::", xx.getAttribute("style"));
 33     
 34 xx.removeAttribute("title");
 35     xx.onclick = function(){
 36         alert("寂寞的季节");
 37     };
 38 
 39     // .onclick 跟 getAttribute("onclick") 的差别
 40     console.log("1.onclick 作为 元素的属性：", xx.onclick);
 41     console.log("2. getAttribute('onclick')", xx.getAttribute("onclick"));
 42  
 43      //xx.setAttribute("mycolor", "red");
 44      xx.mycolor = "red";
 45 
 46     var yy = xx.cloneNode(true);
 47     document.body.appendChild(yy);
 48 
 49 
 50 
 51 
 52     var newNode = document.createElement("p");
 53     newNode.innerHTML = '<span> js 是怎样创建节点？ 怎样添加节点？ 不要跟jq 混淆</span>';
 54     var returnedNode = document.getElementById("xxx").appendChild(newNode);
 55     console.log(returnedNode == newNode);    // true
 56     console.log(returnedNode == document.getElementById("xxx").lastChild);// true
 57 
 58     document.body.appendChild(xx);// xx 已经是文档的一部分，结果是自己被挪动位置而已
 59 
 60 
 61 
 62     console.log(document.body.firstChild.nodeName);// firstChild 也存在兼容性问题 主要是ie7/8
 63 
 64     // slice array ie test
 65     var nodes = document.body.childNodes;
 66     //var arr = Array.prototype.slice.call(nodes, 0);
 67     //console.log("转化为数组", arr);
 68 
 69     function convertToArray(nodes){
 70         var arr = [];
 71         try{
 72             arr = Array.prototype.slice.call(nodes, 0);
 73         }catch(e){
 74             for(var i = 0,len = nodes.length; i < len; i++){
 75                 arr.push(nodes[i]);
 76             }
 77         }
 78         return arr;
 79     }
 80     var array1 = convertToArray(nodes);
 81     console.log(array1[0]);
 82     console.log(array1);
 83     console.log(array1.length);
 84     //console.log(array1[4]);
 85     console.log(array1[2]);
 86 
 87 
 88 
 89     
 90 
 91 
 92     function Person(){
 93 
 94     }
 95 
 96     function assignEvents(){
 97         var id = "xx";
 98 
 99         
100         document.getElementById("xx").onclick = function(e){
101             for(var i = 0; i < 1000; i++){
102                 console.log(this);
103             }
104         };    
105 
106         id = null;
107     }
108 
109     //assignEvents();
110     //window.onload = function(){
111         document.write("is right here in front of me "); // document.write() 在window.onload 之后会重写整个页面 跟jq 的domReady 一样
112     //};