javascript: 一个可以代替jquery选择器的方法
Posted 亦虚
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript: 一个可以代替jquery选择器的方法相关的知识,希望对你有一定的参考价值。
众所周知,与原生js不同,jquery方法 $() 会得到一个jquery对象,而不是js对象。
- 这个方法获取的对象可以用来执行其他jquery方法处理业务逻辑;
- 也可以通过下标获取js DOM。
- 当这个方法没有匹配到DOM的时候,则对象里面没有DOM元素。
$("div span").click()
如果我不想用jquery选择器呢?
先上代码。
function getElementArray (string) { var sel = document.querySelectorAll(string) var arr = new Array().slice.call(sel) return arr }
解释一下知识点:
- document.querySelectorAll(),这个方法可以通过选择器获取一个NodeList。关于NodeList:
NodeList 不是一个数组,是一个类似数组的对象(Like Array Object)。虽然 NodeList 不是一个数组,但是可以使用 forEach() 来迭代。你还可以使用 Array.from() 将其转换为数组。
- slice(),数组原型方法,可从已有的数组中返回包含选定的元素的新数组。当没有参数的时候,返回原元素的全部。
- call() ,函数原型方法。使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。换句话说,在修改其执行上下文的情况下调用一个函数。
也就是说,
- 我们传入一个选择器字符串(Selected String);
- 获取包含指定DOM的NodeList:
- 转成 DOM 数组并返回。
以上。
以上是关于javascript: 一个可以代替jquery选择器的方法的主要内容,如果未能解决你的问题,请参考以下文章
选择多个单选按钮(通过 jquery、javascript?)
为什么原生 JavaScript 开发越来越多受欢迎?是否应该跟风用原生JavaScript代替 jQuery等库?
是否可以使用 JavaScript/jQuery 解决这种情况? [复制]