zoukankan      html  css  js  c++  java
  • 实现一个 $attr(name,value) 遍历;属性为 name 值为 value 的元素集合

    <body>
      <div class="box clearfix"></div>
      <div name="zs"></div>
      <div class="box"></div>
      <div name="ls"></div>
      <div class="attr"></div>
      <div class="box2"></div>
      <div class="box A"></div>
    </body>
     
    --------------------------------------------------------------------------------------------------------------------------------------
     
    function $attr(property, value) {
      // 获取当前页面中所有的标签
      let elements = document.getElementsByTagName('*'),
        arr = [];
      elements = Array.from(elements); // => 把非数组转换为数组
      elements.forEach(item => {
        // => 储存的是当前元素 property 对应的属性值
        let itemValue = item.getAttribute(property);
        if (property === 'class') {
          // => 样式类属性名要特殊处理
          new RegExp("\b" + value + "\b").test(itemValue) ? arr.push(item) : null;
          return;
        }
        if (itemValue === value) {
          // => 获取的值和传递的值校验成功
          arr.push(item);
        }
      });
    return arr;
    }
    console.log($attr('class', 'box'));
  • 相关阅读:
    数组添加元素到特定位置
    jquery $().each,$.each的区别
    JSON字符串 与 JSON对象 互转
    js 获取 url 参数
    js 获取随机数 Math.random()
    js中的|| 与 &&
    js立即执行函数
    css 蒙层
    css 多行文本的溢出显示省略号(移动端)
    移动端利用-webkit-box水平垂直居中(旧弹性盒)
  • 原文地址:https://www.cnblogs.com/HYTing/p/12616816.html
Copyright © 2011-2022 走看看