Element.querySelector和Element.querySelectorAll和jQuery(element).find(selector)选择器的区别

<divid="test1">
    <a href="http://www.hujuntao.com/">设计蜂巢</a>
</div>
<pid="bar">111</p>
<script>
var d1 = document.getElementById('test1'),
   obj1 = d1.querySelector('div a'),
   obj2 = d1.querySelectorAll('div a');
   obj3 = $(d1).find('div a');
   console.log(obj1)//<a href="http://www.hujuntao.com/">设计蜂巢</a>
  console.log(obj2.length)//1
  console.log(obj3)//null(在文档内找全部符合选择器描述的节点不包括Element本身)
</script>

1、Element.querySelector:

   Element.querySelector("a[target]"):获取元素中有 "target" 属性的第一个 <a> 元素

2、Element.querySelectorAl:

   Element.querySelector("a[target]"):获取元素中有 "target" 属性的所有 <a> 元素

3、jQuery(element).find(selector):

   在文档内找全部符合选择器描述的节点不包括Element本身,而querySelector和querySelectorAll 在文档内找全部符合选择器描述的节点包括Element本身

posted @ 2017-03-08 09:41  瘋孑  阅读(594)  评论(0编辑  收藏  举报