ES5 原生Dom 操作

DOMTokenList 有一个表示自己包含多少元素的 length 属性，而要取得每个元素可以使用 item()方
法，也可以使用方括号语法。此外，这个新类型还定义如下方法。
 add(value)：将给定的字符串值添加到列表中。如果值已经存在，就不添加了。
 contains(value)：表示列表中是否存在给定的值，如果存在则返回 true，否则返回 false。
 remove(value)：从列表中删除给定的字符串。
 toggle(value)：如果列表中已经存在给定的值，删除它；如果列表中没有给定的值，添加它。
这样，前面那么多行代码用下面这一行代码就可以代替了：
div.classList.remove("user");
以上代码能够确保其他类名不受此次修改的影响。其他方法也能极大地减少类似基本操作的复杂
性，如下面的例子所示。
//删除"disabled"类
div.classList.remove("disabled");
//添加"current"类
div.classList.add("current");
//切换"user"类
div.classList.toggle("user");

 childElementCount：返回子元素（不包括文本节点和注释）的个数。
 firstElementChild：指向第一个子元素； firstChild 的元素版。
 lastElementChild：指向最后一个子元素； lastChild 的元素版。
 previousElementSibling：指向前一个同辈元素； previousSibling 的元
 nextElementSibling：指向后一个同辈元素； nextSibling 的元素版。

element.insertAdjacentHTML("beforebegin", "<p>Hello world!</p>");
//作为第一个子元素插入
element.insertAdjacentHTML("afterbegin", "<p>Hello world!</p>");
//作为最后一个子元素插入
element.insertAdjacentHTML("beforeend", "<p>Hello world!</p>");
//作为后一个同辈元素插入
element.insertAdjacentHTML("afterend", "<p>Hello world!</p>");

 

var iframe = document.getElementById("myIframe");
var iframeDoc = iframe.contentDocument;

转载于:https://www.cnblogs.com/linzhibin/articles/7782820.html