详解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插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
Mar 24 jQuery
jQuery实现百度登录框的动态切换效果
Apr 21 jQuery
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
Aug 18 jQuery
基于jQuery实现图片推拉门动画效果的两种方法
Aug 26 jQuery
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
浅析vue-router jquery和params传参(接收参数)$router $route的区别
Aug 03 jQuery
jquery.pagination.js分页使用教程
Oct 23 jQuery
jQuery插件实现非常实用的tab栏切换功能【案例】
Feb 18 jQuery
JQueryDOM之样式操作
Mar 27 jQuery
jQuery分组选择器简单用法示例
Apr 04 jQuery
Jquery ajax书写方法代码实例解析
Jun 12 jQuery
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
Jan 29 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
PHP格式化MYSQL返回float类型的方法
2016/03/30 PHP
PHPStorm+XDebug进行调试图文教程
2016/06/13 PHP
Yii使用DbTarget实现日志功能的示例代码
2020/07/21 PHP
彻底搞懂JS无缝滚动代码
2007/01/03 Javascript
JavaScript window.setTimeout() 的详细用法
2009/11/04 Javascript
JavaScript的类型简单说明
2010/09/03 Javascript
javascript上传图片前预览图片兼容大多数浏览器
2013/10/25 Javascript
用JS将搜索的关键字高亮显示实现代码
2013/11/08 Javascript
浅谈javascript的分号的使用
2015/05/12 Javascript
JS函数定义方式的区别介绍
2016/03/22 Javascript
javascript Promise简单学习使用方法小结
2016/05/17 Javascript
Javascript之Number对象介绍
2016/06/07 Javascript
利用jsonp跨域调用百度js实现搜索框智能提示
2016/08/24 Javascript
Angularjs实现带查找筛选功能的select下拉框示例代码
2016/10/04 Javascript
vue动画效果实现方法示例
2019/03/18 Javascript
Vue.js项目实战之多语种网站的功能实现(租车)
2019/08/07 Javascript
[01:06:54]DOTA2-DPC中国联赛 正赛 SAG vs DLG BO3 第二场 2月28日
2021/03/11 DOTA
基于python实现的抓取腾讯视频所有电影的爬虫
2016/04/22 Python
详解python中的文件与目录操作
2017/07/11 Python
便捷提取python导入包的属性方法
2018/10/15 Python
tensorflow ckpt模型和pb模型获取节点名称,及ckpt转pb模型实例
2020/01/21 Python
巴西手表购物网站:eclock
2019/03/19 全球购物
中海讯通笔试题
2015/09/15 面试题
幼儿园长自我鉴定
2013/10/17 职场文书
保险专业大专生求职信
2013/10/26 职场文书
传媒专业推荐信范文
2013/11/23 职场文书
外贸业务员岗位职责
2013/11/24 职场文书
怎样写好自荐信和推荐信
2013/12/26 职场文书
社会保险接收函
2014/01/12 职场文书
初中学生期末评语
2014/04/24 职场文书
2015年宣传部部长竞选演讲稿
2014/11/28 职场文书
廉洁自律承诺书范文
2015/04/28 职场文书
幼儿园安全教育月活动总结
2015/05/08 职场文书
SpringBoot 集成短信和邮件 以阿里云短信服务为例
2022/04/22 Java/Android
利用Python实现模拟登录知乎
2022/05/25 Python
前端与RabbitMQ实时消息推送未读消息小红点实现示例
2022/07/23 Java/Android