zoukankan      html  css  js  c++  java
  • 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
    }

    解释一下知识点:

    1. document.querySelectorAll(),这个方法可以通过选择器获取一个NodeList。关于NodeList:
      NodeList 不是一个数组,是一个类似数组的对象(Like Array Object)。虽然 NodeList 不是一个数组,但是可以使用 forEach() 来迭代。你还可以使用 Array.from() 将其转换为数组。
    2. slice(),数组原型方法,可从已有的数组中返回包含选定的元素的新数组。当没有参数的时候,返回原元素的全部。
    3. call() ,函数原型方法。使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。换句话说,在修改其执行上下文的情况下调用一个函数

    也就是说,

    • 我们传入一个选择器字符串(Selected String);
    • 获取包含指定DOM的NodeList:
    • 转成 DOM 数组并返回。

    以上。

     
  • 相关阅读:
    iOS 友盟统计
    iOS 高德地图 根据经纬度解析成位置
    十六、Swift 可选值链条 Optional Chaining
    十五、自动引用计数 Automatic Reference Counting
    十四、析构器 Deinitialization
    BCB应对WIN7的放大屏幕文本技术
    十三、初始化 Initialization
    十二、继承 Inheritance
    十一、下标 Subscripts
    十、方法 Methods
  • 原文地址:https://www.cnblogs.com/foxcharon/p/13972727.html
Copyright © 2011-2022 走看看