jQuery的核心理念
jQuery框架的核心就是从HTML文档中匹配元素并对其执行操作
jQuery源码整体放在一个匿名函数执行中
(function(window,undefined){//这里是形参 })(window,undefined);//传入实参这样写的好处是：在匿名函数中定义的变量和函数在匿名函数外部都是访问不到的，在匿名函数中提供对外访问的接口
这里把window当做参数传进来是因为window处于作用域的最顶端，它的查找速度是最慢的。
好处1：将window作为实参传递给匿名函数的形参，在匿名函数中可以加快window的查找速度
好处2：在压缩版本中window作为实参传递给匿名函数的形参e，通过这样传递，我们知道在压缩代码中e就代表了window
传入undefined，是因为在匿名函数外部undefined可能被修改为其他值，将undefined作为参数传进来，在匿名函数中用到undefined了就是用的传进来的值而不会向外查找了。
用来输出相应的版本号：
<script type="text/javascript"> alert($().jquery);//弹出版本号 </script> constructor <script type="text/javascript"> { } Person.prototype.name = "lisi"; Person.prototype.age = 20; var person1 = new Person(); alert(person1.constructor);//输出相应的构造函数 /* function Person(){ } */ </script> <script type="text/javascript"> { } Person.prototype = {//这里是重写了原型，这样构造函数指向就出现了问题，需要手动去修正 constructor:Person, name:"lisi", age:20 } var person1 = new Person(); alert(person1.constructor); /* function Object(){ [native code] } */ </script> jQuery对象转为dom对象 <script type="text/javascript"> console.log($("li"));//jQuery.fn.init[3],每个li都有对应的下标 $("li")[1].style.background = "#f00";//$("li")[1]这样可以把jQuery转化为dom对象 </script> parseHTMLjQuery.parseHTML用来将字符串转化为数组,返回一个数组
<script type="text/javascript"> $(str = '<li>1</li><li>2</li><li>3</li>'; var arr = jQuery.parseHTML(str); console.log(arr);//[li, li, li] $.each(arr,function(i){ $("ul").append(arr[i]); }); }); </script> merge script type="text/javascript"> $(arr1 = ['a','b']; var arr2 = ['c','d']; var arr3 = { 0:'a', 1:'b', length:2 }; //$.merge用来合并数组 console.log($.merge(arr1,arr2));console.log($.merge(arr3,arr2));//Object {0: "a", 1: "b", 2: "c", 3: "d", length: 4} }); </script> 正则匹配 <script type="text/javascript"> var rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/; var str1 = '#div1'; var str2 = '<li>hello'; console.log(rquickExpr.exec(str1));//["#div1",undefined,'div1']; console.log(rquickExpr.exec(str2));//["<li>hello", "<li>", undefined] </script> makeArray >2=> <script type="text/javascript"> var oDiv=document.getElementsByTagName("div"); /* oDiv只是一个类数组，并不是真正的数组，类数组不能调用数组的方法 在jQuery中可以通过makeArray方法将类数组转为真正数组 */ console.log(oDiv);//HTMLCollection[div, div, div] console.log($.makeArray(oDiv));//[div, div, div] 变为数组 console.log($.makeArray(oDiv,{length:0}));// Object { 0=div, 1=div, 2=div, 更多...} 变为json形式 </script> </body> pushStack pushStack():JQ对象的入栈 栈是后进先出，所以这里span的背景颜色变红 队列是先进先出 end() 进行出栈操作，来返回栈中的前一个状态 > =>pushStack> => <script type="text/javascript"> $(function(){ $('div').pushStack($('span')).css('background','red'); //end() 进行出栈操作，来返回栈中的前一个状态,所以div背景变黄了 $('div').pushStack($('span')).css('background','red').end().css('background','yellow'); }); > >1111111>1111111=> <script type="text/javascript"> $($('div').slice(1,3).css('background','red').end().css('color','blue'); }); </script> </body> map
相关文章
精彩导读
热门资讯
关注我们
