setAttribute與style.property:關於初識HTML DOM屬性設定的一點思考
阿新 • • 發佈:2018-12-23
對於HTML DOM 來說,我一直用setAttribute來設定屬性值,後來很多問題通過
document.getElementsByTagName("id").setAttribute("type","button");
來設定,很多情況都沒有成功。
問了問前端的相關人員,他們說是通過CSS樣式設定來解決。
document.getElementById("id").style.property="值"
可以執行一下下面的程式碼,進行測試:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoob.com)</title> <style> body {background-color:yellow; color:black;} </style> </head> <body> <p>點選按鈕顯示文件的 style 屬性。</p> <p id="demo" style="background-color:red;">123</p> <button onclick="myFunction()">嘗試一下</button> <script> function myFunction(){ document.getElementById("demo").style.height = "100px"; var attr = document.getElementById("demo").style.height; }; </script> </body> </html>
像這種的DOM,無法通過setAttribute來設定,只有通過CSS樣式修改才能成功。前端人員說這是規定。。。我感覺他也不懂。。
但是在css屬性中,我看到對於設定屬性的時候,取出來的ID元素是作為一個物件來進行新增屬性或者修改屬性的。
下面的網址是整理的所有DOM Style屬性列表: