详解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版本 1.x? 2.x? 3.x?
Apr 01 jQuery
jQuery获取table下某一行某一列的值实现代码
Apr 07 jQuery
jQuery中clone()函数实现表单中增加和减少输入项
May 13 jQuery
jQuery查找和过滤_动力节点节点Java学院整理
Jul 04 jQuery
jQuery初级教程之网站品牌列表效果
Aug 02 jQuery
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
基于jQuery的左滑出现删除按钮的示例
Aug 29 jQuery
jQuery UI 实例讲解 - 日期选择器(Datepicker)
Sep 18 jQuery
jQuery实现监听下拉框选中内容发生改变操作示例
Jul 13 jQuery
jquery图片预览插件实现方法详解
Jul 18 jQuery
jQuery 选择器用法基础入门示例
Jan 04 jQuery
viewer.js一个强大的基于jQuery的图像查看插件(支持旋转、缩放)
Apr 01 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 xml 入门学习资料
2011/01/01 PHP
基于php常用函数总结(数组,字符串,时间,文件操作)
2013/06/27 PHP
实用的简单PHP分页集合包括使用方法
2013/10/21 PHP
PHP实现GIF图片验证码
2015/11/04 PHP
ThinkPHP框架安全实现分析
2016/03/14 PHP
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
用js做一个小游戏平台 (一)
2009/12/29 Javascript
javascript 函数调用的对象和方法
2010/07/01 Javascript
jQuery学习笔记之jQuery的DOM操作
2010/12/22 Javascript
jquery获取div宽度的实现思路与代码
2013/01/13 Javascript
DOM基础教程之使用DOM
2015/01/19 Javascript
JQuery给网页更换皮肤的方法
2015/05/30 Javascript
快速掌握Node.js模块封装及使用
2016/03/21 Javascript
jQuery隐藏和显示效果实现
2016/04/06 Javascript
NodeJs的fs读写删除移动监听
2017/04/28 NodeJs
详解用函数式编程对JavaScript进行断舍离
2017/09/18 Javascript
bootstrap可编辑下拉框jquery.editable-select
2017/10/12 jQuery
基于JS实现html中placeholder属性提示文字效果示例
2018/04/19 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【凹多边形的分离轴检测算法】
2018/12/13 Javascript
JavaScript学习笔记之数组基本操作示例
2019/01/09 Javascript
uni-app微信小程序登录授权的实现
2020/05/22 Javascript
用webAPI实现图片放大镜效果
2020/11/23 Javascript
让Django支持Sql Server作后端数据库的方法
2018/05/29 Python
python安装本地whl的实例步骤
2019/10/12 Python
python Tensor和Array对比分析
2020/01/08 Python
详谈tensorflow gfile文件的用法
2020/02/05 Python
加拿大消费电子和手机购物网站:The Source
2017/01/28 全球购物
个人培训自我鉴定
2014/03/28 职场文书
委托书怎样写
2014/08/30 职场文书
2014党支部对照检查材料思想汇报
2014/10/05 职场文书
城管年度个人总结
2015/02/28 职场文书
2015年派出所工作总结
2015/04/24 职场文书
保护动物的宣传语
2015/07/13 职场文书
整理Python中常用的conda命令操作
2021/06/15 Python
elementui的el-popover修改样式不生效的解决
2021/06/30 Javascript
mysql中关键词exists的用法实例详解
2022/06/10 MySQL