EASYDOM系列教程 之屬性操作

element 物件提供了一些方法實現 html 元素的屬性操作，這種操作要比 node 物件提供的方法操作屬性節點要更便捷。

element 物件提供了 getattribute() 方法用於獲取指定元素的屬性值，其語法結構如下:

var attribute = element.getattribute(attributename);

值得注意的是:如果指定的屬性不存在，則返回  null 或 "" （空字串）。

var btn = document.getelementbyid('btn');

var classname = btn.getattribute('class');
console.log(classname);

element.setattribute(name, value);

值得注意的是:如果該屬性已經存在，則更新該值; 否則將新增乙個新的屬性用指定的名稱和值。

var btn = document.getelementbyid('btn');

var classname = btn.getattribute('class');
classname += ' animate';
btn.setattribute('class',classname);

element.removeattribute(attrname);

值得注意的是:刪除屬性盡量使用 removeattribute() 方法，而不是呼叫 setattribute() 方法將指定屬性的值設定為 null。

如果刪除的屬性不存在的話，不會引發任何異常。

var btn = document.getelementbyid('btn');

btn.removeattribute('class');

var result = element.hasattribute(attrname);

而 result 則是 hasattribute() 方法的返回值，是乙個 boolean 型別的值。如果結果為 true，則表示含有指定的屬性；如果結果為 false，則表示不含有指定的屬性。

我們可以通過以下示例**，學習 hasattribute() 方法的具體使用:

var btn = document.getelementbyid('btn');

var result = btn.hasattribute('class');
console.log(result);

var result = element.hasattributes();

值得注意的是:該方法在某些瀏覽器中，已被廢棄。

var btn = document.getelementbyid('btn');

var result = btn.hasattributes();
console.log(result);

本教程採用知識共享署名-非商業性使用-禁止演繹 4.0 國際許可協議進行許可。

EASYDOM系列教程 之插入節點

node 物件提供了一些用於向 html 頁面插入節點的方法，通過這些方法我們可以實現向 html 頁面新增元素，或者移動 html 頁面中的元素。var parent document.getelementbyid parent var button document.createelement ...

EASYDOM系列教程 之Node介紹

dom 的標準規範中提供了 node 物件，該物件主要提供了用於解析 dom 節點樹結構的屬性和方法。dom 樹結構主要是依靠節點進行解析，稱為 dom 節點樹結構。node 物件是解析 dom 節點樹結構的主要入口。node 物件提供的屬性和方法，可以實現遍歷節點 插入節點和替換節點等操作。而這些...

EASYDOM系列教程 之刪除節點

node 物件提供了 removechild 方法實現從 html 頁面中刪除指定節點。其語法結構如下 var oldchild node.removechild child orelement.removechild child 在上述語法結構中，呼叫 removechild 方法的 node 表...