function $(selector){
  //获取第一个字符
  var firstLetter = selector.charAt(0);
  //对第一个字符进行判断
  switch(firstLetter){
    //#则为id名称;
    case '#' : return idSelector(selector);
    break;
    //.则为class;
    case '.' : return classSelector(selector);
    break;
    default : return tagNameSelector(selector);
  }
  //idSelector
  function idSelector(idS){
    return document.getElementById(idS.substring(1));
  }
  //tagNameSelector;
  function tagNameSelector(tagNameS){
    return document.getElementsByTagName(tagNameS);
  }
  //classSelector
  function classSelector(classS){
  //兼容处理
  if(docuent.getElementsByClassName){
    return document.getElementsByClassName(classS.substring(1));
  }else{
    //放置dom节点的数组
    var arr = [];
    //如果浏览器不兼容getElementsByClassName
    //获取页面中的所有的元素
    var arrTag = document.getElementsByTagName('*');
    //利用正则匹配找到对应的标签
    var reg = new RegExp('(^|\\s)'+classS.substring(1)+'($|\\s)','g');
    //遍历所有的标签
    for(var i = 0 , k = arrTag.length ; i < k ; i++){
    //如果标签拥有对用的class名称 push 到一个数组中
      console.log(arrTag[i].className);
      if(reg.test(arrTag[i].className)){
        arr.push(arrTag[i]);
      }
   }
  return arr;
    }
  }
}

js封装 DOM获取的更多相关文章

  1. 原生js封装dom操作库

    var utils = (function(window) { var flag = "getComputedStyle" in window; function win(attr ...

  2. 原生js封装cookie获取、设置及删除

    使用cookie(key,value,options) 参数key,value,options(可选) function cookie(key,value,options){ if(typeof va ...

  3. 原生js封装的获取某一天是当年的第几周方法

    function getWeek(str){ //str格式为yyy-mm-dd //周日归到了本周 var d=new Date(str); var day=d.getDay(); var orig ...

  4. js封装设置获取cookie

    var docCookies = { getItem: function (sKey) { return decodeURIComponent(document.cookie.replace(new ...

  5. 自己封装的一个js方法用于获取显示的星期和日期时间

    自己封装的一个js方法用于获取显示的星期和日期时间 /** * 获取用于显示的星期和日期时间 * @param date * @returns {string} */ function getWeek ...

  6. js的DOM对象

    1.js的Array对象           ** 创建数组(三种)                          - var arr1 = [1,2,3];                    ...

  7. jQuery对象与JS原生dom对象之间的转换

    jQuery就是JS的一个扩展库,工具库,提供很多方便快捷的方法,所以将JS对象转换为jQuery对象后,能更方便地操作这个对象.但是jQuery对象也不是万能的,有一些JS对象有的能,jQuery对 ...

  8. Js之DOM(一)

    ----------------------------------------------------------------------------------------------第一部分 D ...

  9. JS操作DOM对象——JS基础知识(四)

    一.JavaScript的三个重要组成部分 (1)ECMAScript(欧洲计算机制造商协会) 制定JS的规范 (2)DOM(文档对象模型)重点学习对象 处理网页内容的方法和接口 (3)BOM(浏览器 ...

随机推荐

  1. [学习笔记] pymysql入门

    一.快速开始 对于会用MySQL的朋友来说,开始使用pymysql可以说真的so esay,只要用下面的代码,把想要对数据库的操作放在 sql = " " 里就可以了. 没有接触过 ...

  2. Jquery第二次考核

    1. 名词解释 实例对象:var p1=new Person();  p1就是实例对象 构造:function Person(){} 原型对象:在 JavaScript 中,每当定义一个对象(函数也是 ...

  3. 思路重要or技术重要?

    1,思路串通代码的重要性 前段时间,同事在工作上出现一点难题,在技术大佬中看起来算是微不足道的一点小事,由于没有思路,代码也无从下手,他在百度上条框上搜索自己想要的答案,却始终没有比较理想的,大部分的 ...

  4. C++虚函数的工作原理

    静态绑定与动态绑定 讨论静态绑定与动态绑定,首先需要理解的是绑定,何为绑定?函数调用与函数本身的关联,以及成员访问与变量内存地址间的关系,称为绑定. 理解了绑定后再理解静态与动态. 静态绑定:指在程序 ...

  5. Linux系统下减少LV(逻辑卷)容量

    查看文件系统现有 lv_test 容量,总计9.9G,已使用2% 命令 df -h 2 查看系统中的 PV 情况 命令:pvdisplay vg_test 下有两个 PV,分别为  /dev/sdb1 ...

  6. adb 下载安装

    1.官网下载:选择自己电脑对应的版本 https://www.androiddevtools.cn/#   SDK Tools, SDK platfrom  Tools(解压在sdk 的根目录下) 2 ...

  7. ThreadPoolExecutor线程池的一个面试题

    问题:现有一个线程池,参数corePoolSize = 5,maximumPoolSize = 10,BlockingQueue阻塞队列长度为5,此时有4个任务同时进来,问:线程池会创建几条线程? 如 ...

  8. 2019中山纪念中学夏令营-Day9[JZOJ](第六次模拟赛)

    Begin (题目的排序方式:Unkown其实是按心情排的) 异或:(摘自百度百科) 异或(xor)是一个数学运算符.它应用于逻辑运算.异或的数学符号为“⊕”,计算机符号为“xor”.其运算法则为: ...

  9. LeetCode 85. 冗余连接 II

    题目: 在本问题中,有根树指满足以下条件的有向图.该树只有一个根节点,所有其他节点都是该根节点的后继.每一个节点只有一个父节点,除了根节点没有父节点. 输入一个有向图,该图由一个有着N个节点 (节点值 ...

  10. 实验:keepalived双主抢占模式和非抢占模式和IPVS

    内容: 一:概念.原理   二:实验过程 一.概念 一.keepalived原理及配置解析 keepalived:vrrp协议的实现 vrrp协议:virtual router redundancy ...