您的位置:首页 > Web前端 > JQuery

jquery

2019-06-09 00:22 1631 查看

jQuey是一个非常好用的javascript类库,它是一个轻量级的javascript类库,

jquery的程序入口

$(function(){
alert("hello");
})

或者

$(document).ready(function(){
alert("hello");
})

$(document).ready(fn)与window.onload的区别?
window.onload是最后执行 等jsp的dom树加载完,css,js等静态资源加载完毕执行。

jQuery三种工厂方法

1,jQuery(exp[,context])
exp:选择器
context:上下文,环境/容器,documemt

2,jQuery(html)
html:基于html的一个字符串

3,jQuery(element)
element:js对象,表示一个html元素对象
js对象与jquery对象的相互转换:

<script type="text/javascript">
$(function() {
var $h1 = $("#h1");
alert($h1.val());
//jquery对象转js对象
var h1Node = $h1.get(0);
alert(h1Node.value);

var h2Node = document.getElementById("h2");
alert(h2Node.value);
//jquery对象转js对象
var $h2Node = $(h2Node);
alert($h2Node.val());
})
</script>

2,this指针的作用

$(":input").click(function(){
//指的是事件源
alert(this.value);
$("a").each(function(index,item){
//this指的是当前元素
alert(index+","+$(this).html()+","+$(item).html());
})
})

2. 插件机制

在实际项目开发中,如果遇到了这样一种情况:在jQuery没有发现我们需要的某个方法,这个时候我们不能直接修改jQuery源代码,但是我们可以使用jQuery中的插件扩展机制。,往jQuery类库里面去扩展方法,这类方法就是jQuery插件。

jQuery.fn.extend(object) :jQuery插件扩展方法,只有一个参数object,要求是json对象。

1,json的三种格式
1,1 对象
{sid:‘s01’,sname:‘zs’}

var jsonObj1={
sid:'s001',
sname:'zhangsan'
};
console.log(jsonObj1)

1,2列表/数组
[1,3,4,5]

var jsonObj3 ={
sid:'s002',
sname:'lisi',
hobby:['a','c','b']
};

1,3混合模式

{id:3,hobby:['a','b','c']}

2,json的体现形式

//json对象的字符串体现形式
var a = {
sid:"s001",
sname:"zs"
}
console.log(a);
//json数组的字符串体现形式
var b =[1,2,3,4]
console.log(b);
//json混合模式的字符串体现形式
var c = {id:3,hobby:["a","c"]};
console.log(c);

3,extend的和$.fn.extend的区别

//json对象的字符串体现形式
var jsonObj = {
sid:"s001",
sname:"zs"
}
var jsonObj2 = {
sid:"s001",
sname:"zs",
hobby:["a","c"]
}
//$.extend是用来扩充jQuery类属性及方法的
var json = {};
//用后面的对象扩充第一个对象
//$.extend(json,jsonObj);
//讲解子覆盖的问题,之前已经扩充的属性值会被后面的对象所覆盖
//如果后面对象有新的属性,会据需扩充
$.extend(json,jsonObj,jsonObj2);
console.log(json);
//$.fn.extend是用来扩充jquery实例的属性或者方法所用
$.extend({
a:function(){
alert("aaa");
}
});
$("yellow").a();
alert("yellow");
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: