纠结的DOM 兼容性太差
2013-10-18 17:29
302 查看
var btn1 = document.createElement("input"); btn1.type = "radio"; btn1.name = "choose"; var btn2 = document.createElement("input"); btn2.type = "radio"; btn2.name = "choose"; var btn3 = document.createElement("input"); btn3.type = "radio"; btn3.name = "choose"; document.body.appendChild(btn1); document.body.appendChild(btn2); document.body.appendChild(btn3); var all = document.getElementsByTagName("*");// 取不到文本节点 也取不到注释节点 var images = document.images; console.log(images); /*var img = images.namedItem("mypic"); // chrome 不支持 IEff支持 var img = images["mypic"]; // chrome 不支持 IEff支持 alert(img);*/ //alert(document.getElementById("user")); console.log(document.doctype);// IE 78 Null var xx = document.getElementById("xx"); console.log("tagName", xx.tagName,"nodeName:", xx.nodeName); // .style 跟 getAttribute("style") 的差别 console.log("style::", xx.style); // object console.log("getAttribute() style:::", xx.getAttribute("style")); xx.removeAttribute("title"); xx.onclick = function(){ alert("寂寞的季节"); }; // .onclick 跟 getAttribute("onclick") 的差别 console.log("1.onclick 作为 元素的属性:", xx.onclick); console.log("2. getAttribute('onclick')", xx.getAttribute("onclick")); //xx.setAttribute("mycolor", "red"); xx.mycolor = "red"; var yy = xx.cloneNode(true); document.body.appendChild(yy); var newNode = document.createElement("p"); newNode.innerHTML = '<span> js 是怎样创建节点? 怎样添加节点? 不要跟jq 混淆</span>'; var returnedNode = document.getElementById("xxx").appendChild(newNode); console.log(returnedNode == newNode); // true console.log(returnedNode == document.getElementById("xxx").lastChild);// true document.body.appendChild(xx);// xx 已经是文档的一部分,结果是自己被挪动位置而已 console.log(document.body.firstChild.nodeName);// firstChild 也存在兼容性问题 主要是ie7/8 // slice array ie test var nodes = document.body.childNodes; //var arr = Array.prototype.slice.call(nodes, 0); //console.log("转化为数组", arr); function convertToArray(nodes){ var arr = []; try{ arr = Array.prototype.slice.call(nodes, 0); }catch(e){ for(var i = 0,len = nodes.length; i < len; i++){ arr.push(nodes[i]); } } return arr; } var array1 = convertToArray(nodes); console.log(array1[0]); console.log(array1); console.log(array1.length); //console.log(array1[4]); console.log(array1[2]); function Person(){ } function assignEvents(){ var id = "xx"; document.getElementById("xx").onclick = function(e){ for(var i = 0; i < 1000; i++){ console.log(this); } }; id = null; } //assignEvents(); //window.onload = function(){ document.write("is right here in front of me "); // document.write() 在window.onload 之后会重写整个页面 跟jq 的domReady 一样 //};
相关文章推荐
- java 更新mysql数据库中表格信息
- [分享]未注册含-3杂.cn
- QT学习系列-----2
- SSIS 事务
- sed&&awk 合并行
- jQuery对象与DOM对象之间的转换
- Oracle数据库实例的创建、删除、修改
- spring security 获取当前用户信息
- 实现声音开关的代码
- java 查询mysql数据库表格数据
- SNMP++2.8中文文档
- 博客1
- 用Virtualbox搭建LAMP环境-2.安装Apache server
- RDLC报表-分组序号
- SQL中N $ # @的作用
- ZooKeeper用例--实时更新server列表
- android R文件无法生成错误解决方法
- android多张图片翻转和倒影效果
- 应用中用到拍照、摄像功能的
- C++ 编程语言思维导图