javascript 操作DOM元素樣式

2021-09-11 20:33:02 字數 869 閱讀 2841

點語法: dom.style.color

中括號: dom.style[color]

// 相同點:

// 1. 只能獲取行內樣式,不能獲取內嵌和外部樣式

// 2. 獲取的是帶單位的字串 如: 100px

// 不同點:

// 點語法只能獲取固定的屬性而且不能動態傳參,中括號可以

var h = 'height';

box.style.h = '100px';

// 以上**是錯誤的: 只能 box.style.height = '100px';

var h = 'height';

box.style[h] = '100px';

// 以上**是可以的

由於點語法中括號只能獲取行內樣式,如果需要獲取非行內樣式就必須使用以下方式

// ele 元素節點

ele.currentstyle

window.getcomputedstyle("元素", "偽類");

// 兩個引數都是必須的,如果沒有偽類用 null 代替

/**

* 相容所有瀏覽器,獲取元素的style屬性

* @param obj 需要獲採樣式的元素

* @param attr 需要獲取的屬性

* @returns 返回獲取屬性

*/function getstyle(obj, attr) else

}

JavaScript 操作DOM物件

簡介 全稱 document object model 文件物件模型 是基於文件程式設計的一套api介面,大部分主流瀏覽器都執行了w3c發布的第一級的dom規範,因此解決了瀏覽器相容性問題 任何一種支援dom程式設計的語言都可以使用它,比如html html dom css dom geteleme...

JavaScript中的DOM操作

更新dom 1.直接修改標籤的innerhtml屬性 修改該屬性不僅可以修改文字內容,還可以修改標籤內部的子節點 2.修改innertext或者textcontent屬性 只能修改節點的文字內容,不能新增子節點 3.使用style屬性獲取或者設定對應屬性 插入dom 1.如果在乙個空的dom節點中進...

JavaScript中對DOM操作

1 element,元素 2 attribute,屬性 3 text,文字 var node1 document.createelement div var node2 document.createtextnode hello world 返回當前文件中第乙個類名為 myclass 的元素 var...