jquery源码中有很多精妙的实现,对于我们每天都在使用的东西,一定要知其原理,如果遇到不能使用jquery环境,也能自己封装原生的代码实现. 1.检测类型 众所周知typeof 不能用来检测数据,会返回object,而instanceof和constructor在使用跨页面调用时(iframe子页面调用父页面),两个页面的构造器函数引用不相等会判断不准确. 而Object对象原型中的toString方法隐藏了这个实现,把它挖掘出来: Object.prototype.toString.call…

前提引入 前提当然也是要引入Jquery啦... <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script> 工具方法 ①获取浏览器的名称与版本信息 在jQuery中,通过$.browser对象可以获取浏览器的名称和版本信息,如$.browser.chrome为true,表示当前为Chrome浏览器,$.browser.…

1.获取浏览器的名称与版本信息   在jQuery中,通过$.browser对象可以获取浏览器的名称和版本信息 如$.browser.chrome为true,表示当前为Chrome浏览器, $.browser.mozilla为true,表示当前为火狐浏览器, 可以通过$.browser.version方式获取浏览器版本信息.     2.检测浏览器是否属于W3C盒子模型   浏览器的盒子模型分为两类,一类为标准的w3c盒子模型,另一类为IE盒子模型, 两者区别为在Width和Height这两个属…

实用工具函数,$命名空间的一系列函数,但不操作包装集.它要么操作除DOM元素以外的Javascript对象,要么执行一些非对象相关的操作. JQuery的浏览器检测标志可在任何就绪处理程序执行之前使用这些标志.$.browser :msie,mozilla,safari,opera,version(引擎的版本)$.boxModel: 方框模型,true/false. 决定了元素的内容大小$.styleFloat: float样式的名称,值为字符串,供属性名称使用   element.style[…

1. 事件绑定$(el).bind ie使用attachEvent,其它浏览器使用addEventListener,不同的是ie多了个on前缀,this绑定在window上,需要用call和apply修正this 的指向. if (element.addEventListener) {         element.addEventListener(type, handler, useCapture);     } else {         if (element.attachEvent)…

noConflict(deep) 释放$和Jquery的控制权 isFunction(obj) isArray(obj) isWindow(obj) isNumeric(obj) type(obj) 获取对象的类型 isPlainObject(obj) 通过new Object()或var obj = {}创建的对象返回true.其他返回false isEmptyObject(obj) error(msg) 抛出异常 parseJSON(data) 把一个字符串变成JSON对象 parseXML…

jQuery最强大的功能在于它可以通过css选择器查找元素,它的源码中有一半是sizzle css选择器引擎的代码,在html5规范出来之后,增加了document.querySelector和document.querySelectorAll直接查找元素,如果是做移动端开发的,使用jQuery的必要性大大降低. 用js代码实现css选择器,必然是用正则表达式来识别字符串了,当然浏览器提供的原生api 效率更高,以下代码只做原理性展示,并未优先性能, 例如 1)查找id显然是用document.…

ready事件是jquery的一个很重要的功能,在很久很久以前,我们是使用window.onload监听页面加载成功的,onload事件的好处是你不用考虑浏览器兼容性,也不需要依赖任何框架就可以写,但是在正规的项目最好不要用,他的缺陷是触发的太晚了,要等待所有的图片都加载完成才会触发,严重拖慢了整体的加载性能,于是有了DOMContentLoaded,IE自然是不支持的,但是IE有onreadystatechange事件可以达到同样的效果,如果两者都不行,我们还有万能的onload把守最后一个关…

1. 什么是工具函数 在jQuery中,工具函数是指直接依附于jQuery对象.针对jquery对象本身定义的说法,即全局性的函数,我们统称为工具函数,或Utilities函数.它们有一个明显的特征,一般情况下,采用如下的格式进行调用: $.函数名()或jquery.函数() 2.工具函数的分类 根据工具函数处理对象的不同,可以将其分为下列几大类别:浏览器的检测.数组和对象的操作.字符串操作.测试操作.URL操作. 1)浏览器的检测 在浏览器检测中,又可分为浏览器类型与特征的检测,前者获取浏览器…

一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即使你会使用jQuery也能在阅读中发现些许秘籍. 我们经常要使用脚本处理各种业务逻辑, 最常见的就是数组和对象的操作. jQuery工具函数为我们操作对象和数组提供了便利条件. 二.前言 大部分人仅仅使用jQuery的选择器选择对象, 或者实现页面动画效果. 在处理业务逻辑时常常自己编写很多算法. 本文提醒各位jQuery也能提高我们操作对象和数组的效率. 并且可以将一些常用算法扩充到jQuer…

jQuery源码分析-03构造jQuery对象-工具函数,需要的朋友可以参考下.   作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原创文章,如需转载,请注明来源并保留原文链接. 读读写写,不对的地方请告诉我,多多交流共同进步,本章的的PDF等本章写完了发布. jQuery源码分析系列的目录请查看 http://nuysoft.iteye.com/blog/1177451,想系统的好好写写,目前还是从我感兴趣的部分开始,如果大家有…

工具函数对应的网址在 http://api.jquery.com/categouy/utilities/   工具函数处理对象的不同,可以将其分为几大类别:浏览器的检测.数组和对象的操作.字符串的操作.测试的操作.URL的操作. 1.浏览器的检测 在浏览其的进啊侧中,又可分为浏览器类型与特征的检测,前者获取浏览器的名称或版本信息,今后这检测浏览是否支持标准的W3C盒子模型. 1-1.虽然jquery有很好的浏览器兼容性,但有时程序开发人员需要获取浏览器的相关信息,提供给用户或程序.在jquery…

原文地址:http://www.cnblogs.com/kissdodog/archive/2012/12/27/2835561.html 作者:逆心 --------------------------------- 一.$.browser对象属性 属性列表 说明 webkit webkit相关浏览器则返回true,否则返回false,如google,傲游. mozilla mozilla相关浏览器则返回true,否则返回false,如火狐 safari    safari相关浏览器则返回tr…

官方地址:http://api.jquery.com/category/utilities/ 一.数组和对象操作 1. $.each——遍历 $.each(obj,function(param1,param2))遍历数组时:param1为元素序号,param2为元素内容:遍历对象时:param1为元素属性名,param2为元素属性值. 例如:①遍历数组: $(function () { var arrStu = { "张三:": "60", "李四:&qu…

jQuery的版本一路狂飙啊,现在都到了2.0.X版本了.有空的时候,看看jquery的源码,学习一下别人的编程思路还是不错的. 下面这里是一些jquery的工具函数代码,大家可以看看,实现思路还是很清晰的. // 是否函数 isFunction: function( obj ) { return jQuery.type(obj) === "function"; }, // 是否数组 // 如果浏览器有内置的 Array.isArray 实现,就使用浏览器自身的实现方式, // 否则将…

要点:1.字符串操作2.数组和对象操作3.测试操作4.URL 操作5.浏览器检测6.其他操作 工具函数是指直接依附于 jQuery 对象,针对 jQuery 对象本身定义的方法,即全局性的函数.它的作用主要是提供比如字符串.数组.对象等操作方面的遍历.一．字符串操作在 jQuery 中,字符串的工具函数只有一个,就是去除字符串左右空格的工具函数:$.trim().//$.trim()去掉字符串两边空格var str = ' jQuery ';alert(str);alert($.trim(str…

浏览器及特性检测 jQuery.support.boxModel 如果这个页面和浏览器是以 W3C CSS 盒式模型来渲染的,则等于 true.通常在 IE 6 和 IE 7 的怪癖模式中这个值是 false.在 document 准备就绪前,这个值是 null. jQuery.support.cssFloat 如果用 cssFloat 来访问 CSS 的 float 的值,则返回 true.目前在 IE 中会返回 false,他用 styleFloat 代替. 数组和对象操作 jQuery.e…

// 扩展工具函数 jQuery.extend({ // http://www.w3school.com.cn/jquery/core_noconflict.asp // 释放$的 jQuery 控制权 // 许多 JavaScript 库使用 $ 作为函数或变量名,jQuery 也一样. // 在 jQuery 中,$ 仅仅是 jQuery 的别名,因此即使不使用 $ 也能保证所有功能性. // 假如我们需要使用 jQuery 之外的另一 JavaScript 库,我们可以通过调用 $.noC…

//扩展工具函数 jQuery.extend({ // Unique for each copy of jQuery on the page expando: "jQuery" + ( version + Math.random() ).replace( /\D/g, "" ), // Assume jQuery is ready without the ready module isReady: true, error: function( msg ) { thr…

封装ajax工具函数 首先要思考:1.为什么要封装它?提高开发效率2.把一些不确定的情况考虑在其中 a. 请求方式 b. 请求地址 c. 是否异步 d. 发送参数 e. 成功处理 f. 失败处理3.确定参数 a. Type--请求方式 get (get/post) b. Url--请求地址 默认当前地址 字符串 c. Async--是否异步 true (true/false) d. Data--发送的数据 {} 对象{name:xx} e. Success--成功回调 function 函数 函…

一.工具函数 1.获取浏览器的名称与版本信息 在jQuery中,通过$.browser对象可以获取浏览器的名称和版本信息,如$.browser.chrome为true,表示当前为Chrome浏览器,$.browser.mozilla为true,表示当前为火狐浏览器,还可以通过$.browser.version方式获取浏览器版本信息. 2.检测浏览器是否属于W3C盒子模型 浏览器的盒子模型分为两类,一类为标准的w3c盒子模型,另一类为IE盒子模型,两者区别为在Width和Height这两个属性值中…

jQuery,工具函数 学习要点: 1.字符串操作 2.数组和对象操作 3.测试操作 4.URL 操作 5.浏览器检测 6.其他操作 工具函数是指直接依附于 jQuery 对象,针对 jQuery 对象本身定义的方法,即全局性 的函数.它的作用主要是提供比如字符串.数组.对象等操作方面的遍历. 一．字符串操作 在 jQuery 中,字符串的工具函数只有一个,就是去除字符串左右空格的工具函数: trim()去掉字符串两边空格 var str = ' jQuery '; alert(str); al…

jquery源代码学习_工具函数_type jquery里面有一个很重要的工具函数,$.type函数用来判断类型,今天写这篇文章,是来回顾type函数的设计思想,深入理解. 首先来看一下最终结果: 上面的源代码乍一看似乎艰涩难懂,有点抽象,毕竟是前辈心血之作,深深佩服.对我们初学者,可以从简单入手,来一步一步深化,得到最终的优化方案. 第一个版本 在看<JavaScript高级程序设计>这本书时候,书上提到typeof,typeof可以判断function,number ,undefined,…

jQuery源代码学习笔记_工具函数_noop/error/now/trim jquery提供了一系列的工具函数,用于支持其运行,今天主要分析noop/error/now/trim这4个函数: 1.noop //返回一个空函数 function noop() { } noop这个函数的功能就是什么也不做,方便在全局使用一个空函数,减少内存开销. 2.error function error(msg) { throw new Error(msg); } 用于统一抛出异常,可以减少代码中使用thro…

jQuery工具函数 一.$.browser对象属性 属性列表 说明 webkit webkit相关浏览器则返回true,否则返回false,如google,傲游. mozilla mozilla相关浏览器则返回true,否则返回false,如火狐 safari    safari相关浏览器则返回true,否则返回false,如safari opera   opera相关浏览器则返回true,否则返回false,如opera msie msie相关浏览器则返回true,否则返回false,如IE…

调用名为$. extend的工具函数,可以对原有的工具函数进行扩展,自定义类级别的jQuery插件,调用格式为: $. extend ({options}); 参数options表示自定义插件的函数内容. <body> <div id="divtest"> <div class="title"> <span class="fl">自定义工具函数求两值中最小值</span> <spa…

1.简单模拟JQuery工作原理 (function(window){ var JQuery ={ a: function(){ alert('a'); }, b: function(){ alert('b'); } }; window.JQuery = window.$ = JQuery;})(window); $.a();  //执行A函数 说明: 小括号能把我们的表达式组合分块,并且每一块,也就是每一对小括号,都有一个返回值.这个返回值实际上也就是小括号中表达式的返回值.所以,当我们用一对…

Zepto 提供了丰富的工具函数,下面来一一解读. 源码版本 本文阅读的源码为 zepto1.2.0 $.extend $.extend 方法可以用来扩展目标对象的属性.目标对象的同名属性会被源对象的属性覆盖. $.extend 其实调用的是内部方法 extend, 所以我们先看看内部方法 extend 的具体实现. function extend(target, source, deep) { for (key in source) // 遍历源对象的属性值 if (deep && (i…

PS:原先是想直接进入功能开发,要用到什么函数时再创建,这样也容易熟悉每个函数的由来和使用方法,但考虑到这样操作,到时会经常在不同文件间切换,不好描述,容易造成混乱,所以还是使用函数库这种方式来说明. 下面来说说工具函数包,如果想要快速学会一个新的框架,首先要做的事情就是熟悉工具函数包,一方面,能快速知道有哪些基本功能可以直接调用,不用重复造轮子:另一方面,查看项目代码时,会比较快的进入角色,能看明白很多代码是做什么用的,因为工具函数包被调用的机率是最大的. 那么怎么学习呢?当然是有节奏有计划的…

第一部分 JavaScript工具函数 转义特殊字符为html实体   HtmlEncode: function(str){ return str.replace(/&/g, '&').replace(/\"/g, '"').replace(/</g, '<').replace(/>/g, '>').replace(/'/g, '&apos;'); }, 验证是否为有效的手机电话号码   IsMobile: function(str){…