element：方法八頁

特徵一頁 | 二頁 | 三頁 | 四頁 | 五頁
方法一頁 | 二頁 | 三頁 | 四頁 | 五頁 | 六頁 | 七頁 | 八頁
操控器一頁 | 二頁 | 成員表

element 的方法

querySelector()

取得父元素下，第一個符合選擇器的子元素物件，沒找到則傳回 null。其語法是：

元素物件 = 元素物件.querySelector( 選擇器組 ); <div id='box'> <span style='color:red'>好玩遊戲</span> <span style='color:red'>小遊戲</span> <span style='color:red'>遊戲天堂</span><p> </div> <script type='text/javascript'> document.write( document.body.querySelector("#box").nodeName ); </script>

• Firefox 無此項；IE, Safari, Chrome 有支援。

querySelectorAll()

取得父元素下，所有符合選擇器的子元素物件組。其語法是：

元素物件組 = 元素物件.querySelectorAll( 選擇器組 ); <script type='text/javascript'> var os=document.body.querySelectorAll("#box span"); for(var i=0; i < os.length; i++) document.write( os[i].innerHTML +' / '); </script>

• Firefox 無此項；IE, Safari, Chrome 有支援。

scrollIntoView()

捲動網頁，到元素出現與頂端對齊。其語法是：

元素物件.scrollIntoView( [布林旗] )

可以選擇性的設定布林旗，設為 true 則元素與頂端對齊，設為 false 則與底部對齊。 <a href='javascript: document.getElementById("box"). scrollIntoView( false )'> 點此捲動</a>

setAttribute()

設定元素的屬性。其語法是：

元素物件.setAttribute(屬性名, 屬性值, 數字旗);

數字旗是 IE 定義的，Firefox 無此項；加上數字旗對 Firefox, Safari, Chrome 沒影響。數字旗設為 0，則不分大小寫；設為 1，大小寫不同。 <span id='jolin'>蔡依林</span><p> <script type='text/javascript'> function setAttributeDM() { var eo=document.getElementById("jolin"); //alert( eo.getAttribute('style') ); eo.setAttribute("style", "color:red", 0) alert( eo.getAttribute('style') ); } </script> <a href='javascript:setAttributeDM()'> 點此改成紅色</a>

• 上例，IE 不會動態改成紅色；Firefox, Safari, Chrome 都成功。

setAttributeNS()

用在 XML 文件，後面再談。

setAttributeNode()

設定元素的屬性結。其語法是：

舊的屬性結=元素物件.setAttributeNode( 新屬性結 ); <span id='wu' style='color:blue'>吳宗憲</span> <script type='text/javascript'> var wo=document.getElementById("wu"); var ao=document.createAttribute('style'); ao.nodeValue='color:green'; var bo=wo.setAttributeNode( ao ) ; document.write( bo.nodeValue ); function setAttributeNodeDM() { var wo=document.getElementById("wu"); var ao=document.createAttribute('style'); ao.nodeValue='color:red'; wo.setAttributeNode( ao ) ; alert( wo.getAttributeNode('style').nodeValue ); } </script> <p><a href='javascript:setAttributeNodeDM()'> 點此改成紅色</a>

• 上例，IE 不會動態改成紅色；Firefox, Safari, Chrome 都成功。

setAttributeNodeNS()

用在 XML 文件，後面再談。