jquery01-阿里云开发者社区

jquery01

2017-11-13 1170

简介：

+关注继续查看

jquery2.x 不再支持ie678,会减少兼容性写法，学习的2.0.3，现在是3.2.1，

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>

(function(){//函数作用域，为了不冲突，命名空间。
    
    var a = 10; //匿名函数中var外部是访问不了的
    
    function $(){//外部也访问不了
        alert(a);
    }
    
    window.$ = $;//挂载到window上
    
})();
alert(a);
$();
//$() jQuery();


$('#div1').css();//$('#div1')返回的是对象
$('#div1').html();
$().css();//$()是对象，css()是对象方法
$().html();
$.trim();//$是函数名，trim()是函数的静态方法
$.proxy();


//选择器
$('ul li + p input.class').css();

//回调函数，统一管理
function fn1(){ alert(1) }
function fn2(){ alert(2) }
var cb = $.Callbacks();//回调参数
cb.add(fn1);
cb.add(fn2);
cb.fire();  //1 ,2
cb.remove(fn2);
cb.fire();  //1




setTimeout(function(){
    alert(1);
},1000);
alert(2);


//异步管理、延迟管理
var dfd = $.Deferred();
setTimeout(function(){
    alert(1);
    dfd.resolve();
},1000);
dfd.done(function(){
    alert(2);
});


//数据缓存
$('#div1').data('name' , 'hello');
$('#div1').data('name');  //hello


//队列管理
$('#div1').animate({left : 100});
$('#div1').animate({top : 100});
$('#div1').animate({width : 300});

</script>
</head>

<body>
</body>
</html>

// JavaScript Document
    
(function(){
    
    (21 , 94) 定义了一些变量和函数 jQuery = function(){};
    
    (96 , 283) 给JQ对象，添加一些方法和属性
    
    (285 , 347) extend : JQ的继承方法
    
    (349 , 817) jQuery.extend() : 扩展一些工具方法
    
    (877 , 2856)  Sizzle : 复杂选择器的实现 2000多行，
     * Includes Sizzle.js    选择器，独立的库
     * http://sizzlejs.com/
    
    (2880 , 3042) Callbacks : 回调对象 : 对函数的统一管理
    
    (3043 , 3183) Deferred : 延迟对象 : 对异步的统一管理
    
    (3184 , 3295) support : 功能检测
    
    (3308 , 3652) data() : 数据缓存
    
    (3653 , 3797) queue() : 队列方法 : 执行顺序的管理 
    
    (3803 , 4299) attr() prop() val() addClass()等 : 对元素属性的操作
    
    (4300 , 5128) on() trigger() : 事件操作的相关方法
    
    (5140 , 6057) DOM操作 : 添加 删除 获取 包装 DOM筛选
    
    (6058 , 6620) css() : 样式的操作
    
    (6621 , 7854) 提交的数据和ajax() : ajax() load() getJSON()
    
    (7855 , 8584) animate() : 运动的方法
    
    (8585 , 8792) offset() : 位置和尺寸的方法
    
    (8804 , 8821) JQ支持模块化的模式
    
    (8826)  window.jQuery = window.$ = jQuery;
    
})();

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