原型 - $$() 方法

$$() 方法解析一個或多個 CSS 篩選表示式，類似於用於定義 CSS 規則的那些，並返回與這些篩選器匹配的元素。

語法

$$(cssRule...);

返回值

HTML 元素的陣列。

示例

下面是獲取帶有名稱 div 的所有 DOM 節點的 Javascript 語句的舊寫法。

nodes = document.getElementsByTagName('div');

使用 $$()，我們可以將它縮短如下 -

nodes = $$('div');

下面與 $('contents') 相同，只是它始終返回一個數組。

$$('#contents');

示例

<html>
   <head>
      <title>Prototype examples</title>
      <script type="text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         function test() {
            allNodes = $$("div");
            
            for(i = 0; i < allNodes.length; i++) {
               alert(allNodes[i].innerHTML);
            } 
         }
      </script>
   </head>

   <body>
      <div id = "firstDiv" name = "div">
         <p>This is first paragraph</p> 
      </div>
      
      <div id = "secondDiv" name = "div">
         <p>This is another paragraph</p>
      </div>
      
      <input type = "button" value = "Test $()" onclick = "test();"/>
   </body>
</html>

輸出

更多示例

下面返回 ID 為“contents”的元素內所有帶有 rel 屬性的連結。

$$('#contents a[rel]');

下面返回所有 href 屬性值為“#”（eyeew！）的連結。

$$('a[href="#"]');

下面返回 ID 為“navbar”或“sidebar”的元素中的所有連結。

$$('#navbar a', '#sidebar a');

下面返回所有連結，但排除那些 rel 屬性包含單詞“nofollow”的連結。

$$('a:not([rel~=nofollow])');

下面返回所有表格正文中的所有偶數行。

$$('table tbody > tr:nth-child(even)');

下面返回所有不包含內容（即只有空格）的 DIV。

$$('div:empty');

prototype_utility_methods.htm

列印當前頁

上一個

下一個