jQuery03

<!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>

巴特西

jQuery03

最新文章

热门文章