<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> jQuery.fn = jQuery.prototype = { //添加实例属性和方法 jquery : 版本 constructor : 修正指向问题 init() : 初始化和参数管理 selector : 存储选择字符串 length : this对象的长度 toArray() : 转数组 get() : 转原生集合 pushStack() : JQ对象的入栈 each() : 遍历集合 ready() : DOM加载的接口 slice() : 集合的截取 first() : 集合的第一项 last() : 集合的最后一项 eq() : 集合的指定项 map() : 返回新集合 end() : 返回集合前一个状态 push() : (内部使用) sort() : (内部使用) splice() : (内部使用) }; </script> <script src="jquery-2.0.3.js"></script> <script> alert( $().jquery );//2.0.3 function Aaa(){ } Aaa.prototype.constructor = Aaa;//这是js源码自动生成的 Aaa.prototype.constructor = Array;//改变指向 Aaa.prototype.name = 'hello'; Aaa.prototype.age = 30; Aaa.prototype = { constructor : Aaa,//不重指就是object name : 'hello', age : 30 }; var a1 = new Aaa(); alert( a1.constructor );//Aaa ---------------------------------------------------------------------- //$() jQuery() 对外接口 $(function(){ console.log( $('li').css('background','red') ); $('li')[1].style.background = 'red'; }); var aLi = document.getElementsByTagName('li');//$('li') for(var i=0;i<aLi.length;i++){ aLi[i].style.background = 'red'; } this = {//json不能for循环，因为没有length属性。只能for in 循环 0 : 'li', 1 : 'li', 2 : 'li', length : 3 }; for(var i=0;i<this.length;i++){ this[i].style.background = 'red'; } </script> </head> <body> <ul> <li></li> <li></li> <li></li> </ul> </body> </html>
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src="jquery-203.js"></script> //jQury源码加载进来的，是一个立即执行函数，会先执行一些代码。 <script> $(function(){ var str = '<li>1</li><li>2</li><li>3</li>'; var arr = jQuery.parseHTML(str); //['li','li','li'] alert(arr[0]); $.each(arr,function(i){ $('ul').append( arr[i] ); }); var str1 = '<li>1</li><li>2</li><li>3</li> <script>alert(4)</script>'; var arr1 = jQuery.parseHTML(str,document,true)); $.each(arr,function(i){ $('ul').append( arr[i] ); }); var arr = ['a','b']; var arr1 = { 0 : 'a', 1 : 'b', length : 2 }; var arr2 = ['c','b']; console.log( $.merge(arr,arr2) );//数组合并[a,b,c,d] console.log( $.merge(arr1,arr2) );//json合并｛0,：a,1:b,2:c,3:d｝ $('<li></li>',{title : 'hi',html : 'abcd',css : {background:'red'}}).appendTo( 'ul' ); //html:'abcd',调用this.html('abcd')方法 }); </script> </head> <body> <ul> </ul> </body> </html>
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src="jquery-2.0.3.js"></script> <script> //rootjQuery : $(document) $(document).find('ul li.box'); //find -> sizzle $('ul',document).find('li'); else : jQuery(document).find(); $('ul',$(document)).find('li'); if : jQuery(document).find(); $(function(){}); $(document).ready(function(){}); $('#div1') <- $( $('#div1') ) $(function(){ var aDiv = document.getElementsByTagName('div');//aDiv是一个数组，但是不是真正的数组，不能用数组的方法，makeArray可以转成真正的数组， $.makeArray(aDiv).push(); //$.makeArray(aDiv)返回的书数组[div,div,div] //makeArray()第二个参数是json,makeArray返回的就不是数组，是json,{0:div,1:div,2:div}, console.log( $.makeArray(aDiv,{length:0}) ); }); </script> </head> <body> <div></div> <div></div> <div></div> </body> </html>