Node类型的变化
Node类型中唯一与命名空间无关的变化,就是添加了isSupported()方法。与DOM1级为document.implementation引入的hasFeature()方法类似,isSupported()方法用于确定当前节点具有什么能力。这个方法也接受相同的两个参数:特性名和特性版本号。如果浏览器实现了相应特性,而且能够基于给定节点执行该特性,isSupported()就返回true。来看一个例子:
if (document.body.isSupported("HTML", "2.0")){
//执行只有"DOM2级HTML"才支持的操作
}
由于不同实现在决定对什么特性返回true或false时并不一致,这个方法同样也存在与hasFeature()方法相同的问题。为此,我们建议在确定某个特性是否可用时,最好还是使用能力检测。
DOM3级引入了两个辅助比较节点的方法:isSameNode()和isEqualNode()。这两个方法都接受一个节点参数,并在传入节点与引用的节点相同或相等时返回true。所谓相同,指的是两个节点引用的是同一个对象。所谓相等,指的是两个节点是相同的类型,具有相等的属性(nodeName、nodeValue,等等),而且它们的attributes和childNodes属性也相等(相同位置包含相同的值)。来看一个例子。
var div1 = document.createElement("div");
div1.setAttribute("class", "box");var div2 = document.createElement("div");
div2.setAttribute("class", "box");alert(div1.isSameNode(div1)); //true
alert(div1.isEqualNode(div2)); //true
alert(div1.isSameNode(div2)); //false
这里创建了两个具有相同特性的<div>元素。这两个元素相等,但不相同。
DOM3级还针对为DOM节点添加额外数据引入了新方法。其中,setUserData()方法会将数据指定给节点,它接受3个参数:要设置的键、实际的数据(可以是任何数据类型)和处理函数。以下代码可以将数据指定给一个节点。
document.body.setUserData("name", "Nicholas", function(){});
然后,使用getUserData()并传入相同的键,就可以取得该数据,如下所示:
var value = document.body.getUserData("name");
传入setUserData()中的处理函数会在带有数据的节点被复制、删除、重命名或引入一个文档时调用,因而你可以事先决定在上述操作发生时如何处理用户数据。处理函数接受5个参数:表示操作类型的数值(1表示复制,2表示导入,3表示删除,4表示重命名)、数据键、数据值、源节点和目标节点。在删除节点时,源节点是null;而在复制节点时,目标节点是null。在函数内部,你可以决定如何存储数据。来看下面的例子。
var div = document.createElement("div");
div.setUserData("name", "Nicholas", function(operation, key, value, src, dest){
if (operation == 1){
dest.setUserData(key, value, function(){}); }
});var newDiv = div.cloneNode(true);
alert(newDiv.getUserData("name")); //"Nicholas"UserDataExample.htm
这里,先创建了一个<div>元素,然后又为它添加了一些数据(用户数据)。在使用cloneNode()复制这个元素时,就会调用处理函数,从而将数据自动复制到了副本节点。结果在通过副本节点调用getUserData()时,就会返回与原始节点中包含的相同的值。
https://www.bilibili.com/video/BV1qL411u7eEhttps://www.bilibili.com/video/BV1qL411u7eE