.JQuery文档分析2--JQuery核心与属性操作

简介: JQuery文档 属性的操作....以及一些核心函数用法 1、 $(document).ready(function(){})  是一个文档就绪函数就是在  window.onLoad完全加载执行之后才开始执行ready内部的函数 这等同  $().
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元素的个数 
$("img").size();  这个是方法
$("img").length; 这个是属性
 
4、
返回jQuery对象的选择器...下面的选择器就是 div#foo ul:not([class]) 表示div中id为foo的div  中的不包括class属性的ul元素  ,返回值就是字符串
 $("div#foo ul:not([class])").selector 
 
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();
累死了睡觉
目录
相关文章
|
3月前
|
XML JavaScript 数据格式
jQuery - 获取内容和属性
jQuery 拥有可操作 HTML 元素和属性的强大方法。
51 6
|
3月前
|
存储 JavaScript 前端开发
jQuery 对属性的操作
【10月更文挑战第8天】
|
4月前
|
XML JavaScript 数据格式
jQuery - 获取内容和属性
jQuery - 获取内容和属性
36 5
|
4月前
|
JavaScript IDE 开发工具
jQuery - 获取内容和属性2
jQuery - 获取内容和属性2
26 3
|
4月前
|
JavaScript
jQuery - 设置内容和属性
jQuery - 设置内容和属性
65 2
|
4月前
|
JavaScript
jQuery - 设置内容和属性
jQuery - 设置内容和属性
66 14
|
4月前
|
XML JavaScript 数据格式
jQuery - 获取内容和属性
jQuery - 获取内容和属性
69 12
|
前端开发 JavaScript
Jquery常用操作:checkbox、select取值,radio、checkbox、select选中及其相关
常用Jquery操作:checkbox取值、select取值、radio选中、checkbox选中、select选中及其相关: 1、影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐藏,一句话就搞定了,请看下面使用说明。
1318 0
|
7天前
jQuery+Slick插件实现游戏人物轮播展示切换源码
jQuery+Slick插件实现游戏人物轮播展示切换源码
30 14
|
29天前
|
JavaScript 前端开发
jQuery和CSS3滑动展开菜单按钮插件
这是一款jQuery和CSS3滑动展开菜单按钮插件。该滑动展开菜单按钮在用户点击主菜单按钮之后,子菜单以滑动的方式依次展开
63 21