element：方法五頁

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

element 的方法

getBoundingClientRect()

取得元素的文字矩框物件，無參數。文字矩框物件包含特徵：top, bottom, left, right。 <div id='box'> <span id='fun' style='color:red'>好玩遊戲</span> <span id='small' style='color:red'>小遊戲</span> </div> <script type='text/javascript'> var go=document.getElementById('box'); var ao=go.getBoundingClientRect(); document.write( ao.left +' : '+ ao.top +'<br />'+ ao.right +' : '+ ao.bottom ); </script>

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

getClientRects()

取得元素的所有文字行的文字矩框物件，無參數。文字矩框物件包含特徵：top, bottom, left, right。 <script type='text/javascript'> var ao=document.body.getClientRects(); for( var i=0; i < ao.length; i++) document.write( ao[i].left +' : '+ Math.floor(ao[i].top) +' // '+ ao[i].right +' : '+ Math.floor(ao[i].bottom) ); </script>

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

getElementsByClassName()

取得父元素下，指定 CLASS 名稱的元素物件清單。其語法是：

元素物件清單=父元素物件.getElementsByClassName( 類別名稱字串 ) <div id='star' style='color:red'> <span class='歌星'>蔡依林</span> <b class='笑匠'>吳宗憲</b> <span class='歌星'>阿妹</span> </div> <span class='歌星'>王力宏</span><p> <script type='text/javascript'> var so=document.getElementById('star'); var ao=so.getElementsByClassName('歌星'); for( var i=0; i < ao.length; i++) document.write( ao[i].innerHTML +', '); </script>

• IE無此項；, Firefox, Safari, Chrome 都成功。

getElementsByTagName()

取得父元素下，指定標籤名稱的元素物件清單。標籤名稱通常就是元素名稱，可用 '*' 表所有元素。其語法是：

元素物件清單=父元素物件.getElementsByTagName( 標籤名稱字串 ) <script type='text/javascript'> var so=document.getElementById('star'); var ao=so.getElementsByTagName('*'); for( var i=0; i < ao.length; i++) document.write( ao[i].innerHTML +', '); </script>

getElementsByTagNameNS()

用在 XML 文件，後面再談。