JavaScript操作DOM元素的childNodes和children区别
对于DOM元素，children是指DOM Object类型的子对象，不包括tag之间隐形存在的TextNode，而childNodes包括tag之间隐形存在的TextNode对象。
具体看一下针对children和childNodes在chrome环境下的测试：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <div id="div1" class="div"> <span id="s1" class="sp" lang="zh-cn"> </span> </div> </body> <script type="text/javascript"> function test() { var o = document.getElementById("div1"); var child = o.children; console.log("div1.children运行结果:"); for(i = 0; i < child.length; i++){ console.log(child[i].tagName); } console.log(""); child = o.childNodes; console.log("div1.childNodes运行结果:"); for(i = 0; i < child.length; i++){ console.log(child[i].tagName); } } test(); </script> </html>
测试结果如下：
div1.children运行结果: SPAN div1.childNodes运行结果: undefined SPAN undefined
上面childNodes集合的结果中有两个undefined节点，这连个就是nodeType=3的TextNode。
如果把HTML代码写成如下样式，那么children和childNodes的结果就没有差别了。
<body> <div id="div1" class="div"><span id="s1" class="sp" lang="zh-cn"></span></div> </body>
对document、head、body及div等HTML元素实测未发现有其他差异
-
本文向大家介绍JavaScript HTML DOM元素 节点操作汇总，包括了JavaScript HTML DOM元素 节点操作汇总的使用技巧和注意事项，需要的朋友参考一下 前言 在文档对象模型 (DOM) 中，每个节点都是一个对象。DOM 节点有三个重要的属性 ： 1. nodeName : 节点的名称 2. nodeValue ：节点的值 3. nodeType ：节点的类型 节点类型：元素
-
本文向大家介绍jQuery Dom元素操作技巧，包括了jQuery Dom元素操作技巧的使用技巧和注意事项，需要的朋友参考一下 Dom是Document Object Model的缩写，意思是文档对象模型。DOM是一种与浏览器、平台、语言无关的接口，使用该接口可以轻松访问页面中所有的标准组件。DOM操作可以分为三个方面即DOM Core(核心)、HTM-DOM和CSS-DOM。 jquery 获取
-
问题内容： 我发现自己使用JavaScript，并且遇到了和属性。我想知道它们之间有什么区别。也是一个比另一个更好？ 问题答案： 了解这是Element的属性。1只有Elements具有，并且这些子元素都是Element类型的。2 但是，这是Node的属性。可以包含任何节点。3 一个具体的例子是： 大多数情况下，您想使用它，因为通常您不想在DOM操作中遍历Text或Comment节点。 如果确实要
-
问题内容： 我正在尝试测试DOM元素是否存在，如果确实存在，则将其删除，如果不存在，则将其创建。 检查是否存在，创建元素有效，但删除该元素无效。基本上，所有这些代码所做的就是通过单击按钮将iframe注入网页。我想发生的是，如果iframe已经存在，可以删除它。但是由于某种原因，我失败了。 问题答案： 应该在父级上调用，即： 在您的示例中，您应该执行以下操作：
-
DOM结构操作 新增节点 var div1 = document.getElementById('div1'); //添加新节点 var p1 = document.createElement('p'); p1.innerHTML = 'this is p1'; div1.appendChild(p1); //添加新创建的元素 //移除已有节点 var p2 = document.getEleme
-
DOM节点操作 获取DOM节点 prototype,获取JS对象上的属性 Attribute,获取DOM标签上的属性 获取DOM节点 var div1 = document.getElementById('div1'); //元素 var divList = document.getElementByTagName('div'); //集合 console.log(divList.length);