html:
<ul> <li class="chil1" name="li1">1</li> <li class="chil2 active">2</li> <li class="chil3">3</li> </ul>
1.获取dom对象
querySelectorAll和etElementsByName区别:
querySelectorAll和getElementsByName都是获取的节点列表,querySelectorAll返回的是静态节点,
getElementsByName返回动态节点,区别是当删除某个节点的时候getElementsByName会自动更新节点列表,
而querySelector不会,还是删除前的节点列表,所以绑定事件时会导致死循环的情况发生
querySelector和$("ul").get(0)获取到的是相同的,元素列表(非节点列表),包含里面的元素
console.log('querySelector:',document.querySelector("ul")); console.log('querySelectorAll:',document.querySelectorAll("li")); console.log('getElementsByName获取Dom对象,通过name属性获取:',document.getElementsByName("li1"));
2.获取jquery对象
console.log('jquery对象:',$("ul"));
3.二者转换
console.log('通过jquery的get(index)的方法获取DOM对象:',$("ul").get(0)); console.log('通过jquery获取DOM对象:',$("ul")[0]); console.log("tagName绑定dom元素:",document.getElementsByTagName("li"))