IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    querySelector和querySelectorAll的功能及区别

    admin发表于 2016-11-21 09:42:32
    love 0

    HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的选择器。这使得在编写原生JavaScript代码时方便了许多。

    用法:

    两个方法使用差不多的语法,都是接收一个字符串参数,这个参数需要是合法的CSS选择语法。

    element = document.querySelector('selectors');
    elementList = document.querySelectorAll('selectors');

    其中参数selectors 可以包含多个CSS选择器,用逗号隔开。

    element = document.querySelector('selector1,selector2,...');
    elementList = document.querySelectorAll('selector1,selector2,...');

    使用这两个方法无法查找带伪类状态的元素,比如querySelector(‘:hover’)不会得到预期结果。

    querySelector

    该方法返回满足条件的单个元素。按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找,返回第一个满足条件的元素。

    querySelectorAll

    该方法返回所有满足条件的元素,结果是个nodeList集合。查找规则与前面所述一样。

    摘自:http://www.cnblogs.com/Wayou/p/html5_web_api_queryselector.html#undefined


    © admin for 可乐吧, 2016. | Permalink | No comment | Add to del.icio.us
    Post tags: querySelector, querySelectorAll

    您可能也喜欢:
    函数的调用和引用(不带括号)
    访问对象属性的方式及区别
    button和submit有什么区别呢?
    onchange,onpropertychange,oninput有何区别
    无觅

    Feed enhanced by Better Feed from Ozh



沪ICP备19023445号-2号
友情链接