原型 - $$() 方法



$$() 方法解析一个或多个 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
广告