JQuery文档分析2--JQuery核心与属性操作
2012-07-13 10:10
435 查看
JQuery文档 属性的操作....以及一些核心函数用法
1、
$(document).ready(function(){}) 是一个文档就绪函数就是在 window.onLoad完全加载执行之后才开始执行ready内部的函数
这等同 $().readdy() 和 $()
2、
这个类似与java中的for each...就是遍历获取到的所有ul中的li对象.集合 ..然后注册一个函数,这个函数要有一个参数 ,每次会传递一个
基于0递增的数字 ...代表每个dom元素在jQuery对象序列中的索引..当然也可以不传递..参数
$("ul li").each(function(i){
this.innerHTML="XXX"+i; } //this代表当前dom对象 ..我们可以像HTML DOM一样操作元素
);
3、
返回jQuery对象中的dom元素的个数
6、
获取li的jQuery对象中索引为0的li的dom独享并且将innerHTML设置为 innerHTML
$("li").get(0).innerHTML="innerHTML";
7、
遍历jQuery中的dom集合
$().ready(
function(){
var col=$("li").get() ;
for(var i in col){
col[i].innerHTML="DOM 集合遍历";
}
}
);
8、
$("div").removeData("greeting");
11、
上述data方法的底层实现///不建议使用
12、
jQuery.noConflict(); 防止 jQuery$和其他库冲突...如果其他库在这个jQuery引入之后那么可以使用jQuery代替$
否则重新定义$
var newfunc=jQuery.noConflict() ;
newfunc("div").hide();
1、
$(document).ready(function(){}) 是一个文档就绪函数就是在 window.onLoad完全加载执行之后才开始执行ready内部的函数
这等同 $().readdy() 和 $()
2、
这个类似与java中的for each...就是遍历获取到的所有ul中的li对象.集合 ..然后注册一个函数,这个函数要有一个参数 ,每次会传递一个
基于0递增的数字 ...代表每个dom元素在jQuery对象序列中的索引..当然也可以不传递..参数
$("ul li").each(function(i){
this.innerHTML="XXX"+i; } //this代表当前dom对象 ..我们可以像HTML DOM一样操作元素
);
3、
返回jQuery对象中的dom元素的个数
$("img").size(); 这个是方法
$("img").length; 这个是属性[/code]
4、
返回jQuery对象的选择器...下面的选择器就是 div#foo ul:not([class]) 表示div中id为foo的div 中的不包括class属性的ul元素 ,返回值就是字符串
$("div#foo ul:not([class])").selector[/code]
5、
$("ul", document.body).context.nodeName 返回节点的名字...即第二个参数..如果第二个参数为空那么默认是 当前文档
6、
获取li的jQuery对象中索引为0的li的dom独享并且将innerHTML设置为 innerHTML
$("li").get(0).innerHTML="innerHTML";
7、
遍历jQuery中的dom集合
$().ready(
function(){
var col=$("li").get() ;
for(var i in col){
col[i].innerHTML="DOM 集合遍历";
}
}
);
8、
$('li').index(document.getElementById('bar')); //1,传递一个DOM对象,返回这个对象在原先集合中的索引位置$('li').index($('#bar')); //1,传递一个jQuery对象$('li').index($('li:gt(0)')); //1,传递一组jQuery对象,返回这个对象中第一个元素在原先集合中的索引位置$('#bar').index('li'); //1,传递一个选择器,返回#bar在所有li中的做引位置$('#bar').index(); //1,不传递参数,返回这个元素在同辈中的索引位置。
9、
jQuery的data方法给dom元素设置键值对 .... 如果不设置那么是null或者 undefined
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <script type="text/javascript" src="js/jquery.js" ></script> <script type="text/javascript"> $().ready(function(){ $("ul li#one").data("data",{key1:"key1",key2:"key2"}) ; $("button").click(function(){ $("#one").text($("#one").data("data").key1); $("#two").get(0).innerHTML=$("#one").data("data").key2; }) ; }) ; </script> <title>Insert title here</title> </head> <ul> <li id="one"></li> <li id="two"></li> <li id="three"></li> <li id="four"></li> <li id="five"></li> </ul> <button>显示数据</button> </body> </html>
10、
移除div上这只的key为greeting的数据
$("div").removeData("greeting");
11、
上述data方法的底层实现///不建议使用
jQuery.data(document.body, 'foo', 52);jQuery.data(document.body, 'bar', 'test');
12、
jQuery.noConflict(); 防止 jQuery$和其他库冲突...如果其他库在这个jQuery引入之后那么可以使用jQuery代替$
否则重新定义$
var newfunc=jQuery.noConflict() ;
newfunc("div").hide();
相关文章推荐
- .JQuery文档分析2--JQuery核心与属性操作
- .JQuery文档分析2--JQuery核心与属性操作
- [原创] jQuery源码分析-12 DOM操作-Manipulation-核心函数jQuery.buildFragment()
- [原创] jQuery源码分析-12 DOM操作-Manipulation-核心函数jQuery.clean()
- jQuery 之 (二)事件操作、jq对文档的操作、属性选择器使用
- JQuery文档分析1-JQuery核心与选择器
- JQuery文档分析1-JQuery核心与选择器
- jQuery源码分析-12 DOM操作-Manipulation-核心函数.domManip()
- jQuery-对标签元素 文本操作-属性操作-文档的操作
- jQuery源码分析-12 DOM操作-Manipulation-核心函数jQuery.buildFragment()
- jQuery核心:DOM操作及属性方法
- [原创] jQuery源码分析-12 DOM操作-Manipulation-核心函数.domManip()
- jQuery源码分析-12 DOM操作-Manipulation-核心函数jQuery.clean()
- jquery-选择器、筛选器、样式操作、文本操作、属性操作、文档处理
- jQuery文档分析4-属性的动态设置
- jQuery 效果函数,jquery文档操作,jQuery属性操作方法,jQuerycss操作函数,jQuery参考手册-事件,jQuery选择器
- jQuery——入门(三)JQuery DOM操作(核心处理和文档处理)
- jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法
- jQuery文档分析4-属性的动态设置
- Jquery选择器大全、属性操作、css操作、文档、事件等