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>
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/6901778.html,如需转载请自行联系原作者

相关文章
|
2月前
|
JavaScript 前端开发
JQuery 什么是JQuery?
JQuery 什么是JQuery?
37 0
|
7月前
|
JavaScript 前端开发 开发者
|
7月前
|
JavaScript 前端开发 开发工具
jQuery
jQuery是一个流行的JavaScript库,它简化了HTML文档的遍历、操作、事件处理和动画等任务,使得Web开发更加高效和直观。使用jQuery,可以轻松地添加、删除或修改HTML元素的内容,也可以方便地处理用户输入和表单验证等问题。jQuery还提供了丰富的插件和扩展,可以实现更多的功能,例如动画效果、滚动效果、表格排序等。
51 7
|
机器学习/深度学习 存储 JSON
Jquery
介绍Jquery
|
JavaScript CDN
|
JavaScript 前端开发 索引
初识jQuery
初识jQuery
107 0
|
JavaScript 前端开发
JQuery01
JQuery01
140 0
JQuery01
|
Web App开发 前端开发 JavaScript
从零玩转jQuery-初识jQuery
课前须知: 学习jQuery前必须先掌握JavaScript jQuery虽然属于前端技术, 但是对于后端人员(诸如Java、PHP等,也需要掌握) jQuery是什么? jQuery是一款优秀的JavaScript库,从命名可以看出jQuery最主要的用途是用来做查询(jQuery=js+Query).
1843 0
|
JSON JavaScript 前端开发