详解jquery选择器的原理


Posted in jQuery onAugust 01, 2017

详解jquery选择器的原理

html部分

<!doctype html> 
<html lang="en"> 
<head> 
  <meta charset="UTF-8" /> 
  <title>Document</title> 
  <script src="js/minijquery.js"></script> 
</head> 
<body> 
  <div class="one">1</div> 
  <div class="two">2</div> 
</body> 
<script> 
  var result = $("div"); 
  console.log(result); 
  alert($('div').size()); 
</script> 
</html> js

js部分

(function(){ 
  //暴露外部的引用 
  var jQuery = window.jQuery = window.$ = function(selector){ 
    return new jQuery.fn.init(selector); 
  } 
   
  //添加原型事件 
  jQuery.fn = jQuery.prototype = { 
    // 
    init:function(selector){ 
      var element = document.getElementsByTagName(selector); 
      Array.prototype.push.apply(this,element); 
      return this; 
    }, 
    myjQuery:"the test one", 
    length:0, 
    size:function(){ 
      return this.length; 
    } 
  } 
   
  //将init的原型引用成jQuery的原型 
  jQuery.fn.init.prototype = jQuery.fn; 
   
})();

我用我的理解解释一下,就是jquery原型里面有一个init初始化的方法,将传入的值进行解析,比如传入的id还是class还是标签名。然后通过相应的方法返回数组型对象。既可以通过对象直接调用方法,也可以使用数组的length。

以上就是jQuery 原理的分析,如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

jQuery 相关文章推荐
jQuery EasyUI之验证框validatebox实例详解
Apr 10 jQuery
jquery中$.fn和图片滚动效果实现的必备知识总结
Apr 21 jQuery
jQuery+ajax实现修改密码验证功能实例详解
Jul 06 jQuery
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 jQuery
jQuery实现的文字逐行向上间歇滚动效果示例
Sep 06 jQuery
集成vue到jquery/bootstrap项目的方法
Feb 10 jQuery
jQuery动态添加li标签并添加属性和绑定事件方法
Feb 24 jQuery
jQuery事件多次绑定与解绑问题实例分析
Feb 19 jQuery
jquery 验证用户名是否重复代码实例
May 14 jQuery
jQuery实现简单弹幕效果
Nov 28 jQuery
jQuery操作元素的内容和样式完整实例分析
Jan 10 jQuery
jquery实现简单每周轮换的日历
Sep 10 jQuery
jQuery上传插件webupload使用方法
Aug 01 #jQuery
关于jquery form表单序列化的注意事项详解
Aug 01 #jQuery
简述jQuery Easyui一些用法
Aug 01 #jQuery
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
Aug 01 #jQuery
jquery easyui如何实现格式化列
Jul 30 #jQuery
jQuery dateRangePicker插件使用方法详解
Jul 28 #jQuery
jQuery获取table表中的td标签(实例讲解)
Jul 28 #jQuery
You might like
PHP4实际应用经验篇(4)
2006/10/09 PHP
通过table标签,PHP输出EXCEL的实现方法
2013/07/24 PHP
PHP中通过trigger_error触发PHP错误示例
2015/06/23 PHP
javascript十个最常用的自定义函数(中文版)
2009/09/07 Javascript
来自国外的30个基于jquery的Web下拉菜单
2012/06/22 Javascript
js防止表单重复提交的两种方法
2013/09/30 Javascript
举例讲解如何判断JavaScript中对象的类型
2016/04/22 Javascript
基于BootStrap的图片轮播效果展示实例代码
2016/05/23 Javascript
jQuery插件 Jqplot图表实例
2016/06/18 Javascript
vue.js通过自定义指令实现数据拉取更新的实现方法
2016/10/18 Javascript
详解nodejs微信公众号开发——6.自定义菜单
2017/04/13 NodeJs
微信小程序使用progress组件实现显示进度功能【附源码下载】
2017/12/12 Javascript
vue input 输入校验字母数字组合且长度小于30的实现代码
2018/05/16 Javascript
Angular8基础应用之表单及其验证
2019/08/11 Javascript
新手该如何学python怎么学好python?
2008/10/07 Python
用Python生成器实现微线程编程的教程
2015/04/13 Python
Python实现的数据结构与算法之链表详解
2015/04/22 Python
Python实现将不规范的英文名字首字母大写
2016/11/15 Python
Python排序算法实例代码
2017/08/10 Python
Python-Seaborn热图绘制的实现方法
2019/07/15 Python
python字符串,元组,列表,字典互转代码实例详解
2020/02/14 Python
阿迪达斯印尼官方网站:adidas印尼
2020/02/10 全球购物
自我鉴定思想方面
2013/10/07 职场文书
自动化专业个人求职信范文
2013/11/29 职场文书
电子工程专业毕业生求职信
2014/03/14 职场文书
闭幕式主持词
2014/04/02 职场文书
竞选班干部的演讲稿
2014/04/24 职场文书
趵突泉导游词
2015/02/03 职场文书
2015年老干部工作总结
2015/04/23 职场文书
2015年度残疾人工作总结
2015/05/14 职场文书
2015年初三班主任工作总结
2015/05/21 职场文书
施工现场安全管理制度
2015/08/05 职场文书
导游词之徐州-云龙山
2019/09/29 职场文书
分享几种python 变量合并方法
2022/03/20 Python
angular4实现带搜索的下拉框
2022/03/25 Javascript
Golang 字符串的常见操作
2022/04/19 Golang