目前实现的功能有以下几点:

  1.$("#adom"); // 返回id为adom的DOM对象

  2.$("a"); // 返回一个a标签的数组

  3.$(".classa"); // 返回一个class的数组

  4.$("[data-log]"); // 返回一个包含属性data-log的数组

  5.$("[data-time=2015]"); // 返回一个属性为data-time且值为2015的数组

其他选择器有时间在弄吧。

  1. function $() {
  2. var a = arguments,len,str,sub,dataReg;
  3. // class兼容IE
  4. function classN(n){
  5. var tag = document.getElementsByTagName("*");
  6. for(var i=0,arr=[];i<tag.length;i++){
  7. if(tag[i].className.indexOf(n)!==-1){
  8. arr.push(tag[i]);
  9. }
  10. }
  11. return arr;
  12. }
  13. // 自定义data选择器
  14. function data(d){
  15. var tag = document.getElementsByTagName("*");
  16. var reg = /\-([\d\w]+)\]/;
  17. for(var i=0,arr=[];i<tag.length;i++){
  18. if(tag[i].dataset[reg.exec(d)[1]]){
  19. arr.push(tag[i]);
  20. }
  21. }
  22. return arr;
  23. }
  24. // 自定义data选择器严格版
  25. function dataT(d){
  26. var tag = document.getElementsByTagName("*");
  27. var reg = /\[data\-([\w\d]+)\=([\w\d]+)/;
  28. for(var i=0,arr=[];i<tag.length;i++){
  29. if(tag[i].dataset[reg.exec(d)[1]]===reg.exec(d)[2]){
  30. arr.push(tag[i]);
  31. }
  32. }
  33. return arr;
  34. }
  35. // 如果是函数,将函数添加到load事件中
  36. if((typeof a[0])==="function"){
  37. window.addEventListener('load',a[0]);
  38. }else{
  39. len = a.length;
  40. str = a[0].charAt(0);
  41. sub = a[0].substring(1);
  42. dataReg = /\=/.test(a[0]);
  43. switch(str){
  44. case "#":
  45. return document.getElementById(sub);
  46. break;
  47. case ".":
  48. return classN(sub);
  49. break;
  50. case "[":
  51. switch(dataReg){
  52. case false:
  53. return data(a[0]);
  54. break;
  55. case true:
  56. return dataT(a[0]);
  57. break;
  58. }
  59. break;
  60. default:
  61. return document.getElementsByTagName(a[0]);
  62. break;
  63. }
  64. }
  65. }

模拟Jquery选择器的更多相关文章

  1. 使用原生js模拟jQuery选择器,实现new方法,兼容ie5

    // 考虑到兼容ie5,未使用es6语法 /* 使用方法: 在<head>标签中(需使用ready方法): <script src="./jQuery2.js"& ...

  2. 模拟jquery封装选择器

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  4. js框架封装,模拟jQuery封装

    模拟jQuery框架,利用原生的js技术,封装一个js框架,以加深对jQuery的常用api的使用和面向对象原理的理解:一:结构部分首先利用闭包,构造一个自执行函数,然后利用选择器函数Sizzle,获 ...

  5. [转]jQuery 选择器和dom操作

    居然是12年的总结.... 文章地址: http://www.cnblogs.com/happyPawpaw/articles/2595092.html JQuery选择器 1.基本选择器 基本选择器 ...

  6. 原生JS模拟jQuery $

    模拟jQuery的$选择器 在获取元素的时候使用ID选择器,返回的是一个对象:使用类选择器或者标签选择器返回可能是一组元素:将获取到的一个或一组元素进行一个简易的封装封装成一个TQObject 什么是 ...

  7. JQuery 选择器

    选择器是JQuery的根基,在JQuery中,对事件的处理,遍历DOM和AJAX操作都依赖于选择器.如果能够熟练地使用选择器,不仅能简化代码,而且还可以事半功倍. JQuery选择器的优势 1.简洁的 ...

  8. jQuery的案例及必知重要的jQuery选择器

    Jquery能做什么 访问和操作DOM元素 控制页面样式 对页面事件进行处理 扩展新的jQuery插件 与Ajax技术完美结合 Jquery的优势 体积小,压缩后只有100KB左右 l强大的选择器 出 ...

  9. 深入学习jQuery选择器系列第一篇——基础选择器和层级选择器

    × 目录 [1]id选择器 [2]元素选择器 [3]类选择器[4]通配选择器[5]群组选择器[6]后代选择器[7]兄弟选择器 前面的话 选择器是jQuery的根基,在jQuery中,对事件处理.遍历D ...

随机推荐

  1. windows下clang的安装与使用

    我本意是想在windows下学习下C++11,而结果是我的Visual Studio 2012不完全支持,而我又懒得去安装2013/2015,太大了.公司运维也不允许我去下载- -,然后就想能不能在w ...

  2. nginx+tomcat+java部署总结

    昨天部署了一下nginx+tomcat+java出现了很多问题,以下为整理总结. 使用了两种部署方式,一种是源码部署,一种是war部署. java源码部署总结: 环境:nginx+tomcat 部署方 ...

  3. 成功在神舟K650c-i7 d2(i7-4700MQ、HM87)上装好了Windows XP

    成功在神舟K650c-i7 d2(i7-4700MQ.HM87)上装好了Windows XP 本来已经在K650c上装好了Windows7.Windows8双系统,奈何某些旧软件只能在Windows ...

  4. ThinkCMF 解决xss攻击问题

    最近使用ThinkCMF给某政府开发的一个平台,因为他们需要通过国家二级信息安全等级测试 所以自己先使用Appscan测试了一下,结果扫描出一个xss安全问题 测试的网址:http://www.xxx ...

  5. 最近的shell脚本(updating)

    1.批量替换 sed -i 's/class="table"/class="table table-hover"/g' `grep 'class="t ...

  6. EF 5.0 帮助类

    EF 5.0 帮助类 加入命名空间: using System; using System.Data; using System.Data.Entity; using System.Data.Enti ...

  7. Python: 测试函数是否被调用

    # helper class defined elsewhere class CallLogger(object): def __init__(self, meth): self.meth = met ...

  8. spring mvc jsp运行不起来的问题

    spring mvc已经处理成让jsp运行,即: <bean class="org.springframework.web.servlet.view.InternalResourceV ...

  9. [原创]Java中的字符串比较,按照使用习惯进行比较

    java中的字符串比较一般可以采用compareTo函数,如果a.compareTo(b)返回的是小于0的数,那么说明a的unicode编码值小于b的unicode编码值. 但是很多情况下,我们开发一 ...

  10. Openvswitch原理与代码分析(2): ovs-vswitchd的启动

    ovs-vswitchd.c的main函数最终会进入一个while循环,在这个无限循环中,里面最重要的两个函数是bridge_run()和netdev_run().     Openvswitch主要 ...