返回到:DOM对象:CSS 样式声明对象
定义和使用
item() 方法返回 CSS 样式中指定索引位置的属性名,索引值从 0 开始。
所有主要浏览器都支持item() 方法
语法
style.item(index)
属性值
参数 | 描述 |
---|---|
index | 必需。一个数字,代码 CSS 样式属性的索引位置。 |
技术细节
DOM 版本: | CSS Object Model |
---|---|
返回值: | 字符串, 表示属性名。 |
实例
DEMO1:返回 id 为 ex1 元素对应样式的第一个属性名。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176教程(Web176.com)</title> </head> <body> <h1>item() 方法</h1> <p>点击按钮返回 id 为 ex1 元素对应样式的第一个属性名:</p> <div id="ex1" style="color:blue; font-family:monospace;">一些文本</div> <button onclick="myFunction()">点我</button> <script> function myFunction() { var style = document.getElementById('ex1').style; var propname = style.item(0); alert(propname); } </script> </body> </html>
DEMO2:循环输出元素的所有样式的属性名。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176教程(Web176.com)</title> </head> <body> <h1 style="color: red; font-size: 50px; ">循环输出所有 CSS 属性</h1> <p>点击按钮显示所有 h1 元素的 CSS 属性。</p> <button onclick="myFunction()">点我</button> <p id="demo"></p> <script> function myFunction() { var elmnt, i, txt = ""; elmnt = document.getElementsByTagName("h1")[0]; for (i = 0; i < elmnt.style.length; i++) { txt += elmnt.style.item(i) + "<br>"; } document.getElementById("demo").innerHTML += txt; } </script> </body> </html>
作者:terry,如若转载,请注明出处:https://www.web176.com/javascriptbook/domtips/3794.html