当前位置:主页   - 电脑 - 程序设计 - JAVA
mootools框架【八】-Dom篇: Css查询支持之Dom.js
来源:网络   作者:   更新时间:2012-08-11
收藏此页】    【字号    】    【打印】    【关闭

  说明:mootools支持通过Css选择器语法来获取元素节点,以最少的代码做最多的事情。在Dom.js中提供了实现这些功能的工具方法以及元素级的扩展。

  1.方法:$E

  作用:按照css选择器语法获取第一个符合规则的元素

  参数:

  selector:css选择器,如a,#my_div等

  filter:可选,过滤范围,默认是document

  例子:

<divid="myDiv">
  <ahref=http://tech.ddvip.com/2008-09/"#"id="link1">AAA</a>
  <ahref=http://tech.ddvip.com/2008-09/"#"id="link2">BBB</a>
  <ahref=http://tech.ddvip.com/2008-09/"#"id="link3">CCC</a>
</div>

  $E('a','myDiv');  //获取的是id为link1的超链接元素

  2.方法:$ES

  作用:按照css选择器语法获取所有符合规则的元素

  参数:

  selector:css选择器,如a,#my_div等

  filter:可选,过滤范围,默认是document

  例子:

<divid="myDiv">
   <ahref=http://tech.ddvip.com/2008-09/"#"id="link1">AAA</a>
   <ahref=http://tech.ddvip.com/2008-09/"#"id="link2">BBB</a>
   <ahref=http://tech.ddvip.com/2008-09/"#"id="link3">CCC</a>
 </div>

  $ES('a','myDiv');   //获取所有3个链接元素

  -------------------------------------------------------------------------------------------------------

  对Element的扩展方法:

  3.方法:getElements

  作用:获取当前元素下符合给出css选择器的元素

  例子:

<divid="myDiv">
   <ahref=http://tech.ddvip.com/2008-09/"#"id="link1">AAA</a>
   <ahref=http://tech.ddvip.com/2008-09/"#"id="link2">BBB</a>
   <ahref=http://tech.ddvip.com/2008-09/"#"id="link3">CCC</a>
 </div>

  $('myDiv').getElements('a'); //获取myDiv下的3个链接

  4.方法:getElementById

  作用:如同document.getElementById方法一样,该方法也是按照指定id来获

  取元素,只不过是再当前元素之下的范围内查找。

  例子:$('myDiv').getElementById('link2');

  5.方法:getElement

  作用:功能如同$E,只不过查找范围是当前元素。获取当前元素下符合指定选择

  器的第一个元素。

  例子:$('myDiv').getElement('a');

  6.方法:getElementsBySelector

  作用:功能和getElements大致相同,并且支持css选择器中的逗号。该方法使

  用的时候可以用$$来替代。

  例子:$('myDiv').getElementsBySelector('#link1,#link2');

  ---------------------------------------------------------------------------------------------------

  document又在以上扩展的基础上被扩展出一个方法:

  getElementsByClassName

  document.getElementsByClassName('my_clazz');

  补充说明:标准javascript中只有document有getElementsByTagName。经过扩展,mootools又让每个Element元素可以使用getElementsByTagName方法: $('myDiv').getElementsByTagName('a');

  这部分的扩展已经让mootools的对象获取方式足够方便和强大

  文章来源: http://www.cnblogs.com/ziyiFly/archive/2008/09/11/1289239.html

其它资源
来源声明

版权与免责声明
1、本站所发布的文章仅供技术交流参考,本站不主张将其做为决策的依据,浏览者可自愿选择采信与否,本站不对因采信这些信息所产生的任何问题负责。
2、本站部分文章来源于网络,其版权为原权利人所有。由于来源之故,有的文章未能获得作者姓名,署“未知”或“佚名”。对于这些文章,有知悉作者姓名的请告知本站,以便及时署名。如果作者要求删除,我们将予以删除。除此之外本站不再承担其它责任。
3、本站部分文章来源于本站原创,本站拥有所有权利。
4、如对本站发布的信息有异议,请联系我们,经本站确认后,将在三个工作日内做出修改或删除处理。
请参阅权责声明