jquery对象访问是什么及使用方法介绍_jquery

jquery对象访问

each(callback)

size()

length

selector

context

get()

get(index)

index([subject])

测试用例

以下是通过代码的方式测试上述jQuery对象访问，供不明白的朋友们参考：

    <script type="text/javascript" src="./js/jquery.min.js?1.1.15">《script》
  span1  span2  span3  span4  span5
<script type="text/javascript">  var spanList = $("p span");  spanList.each(function(){    // alert(this.innerHTML);  //这个获取的是span元素而不是jQuery对象，这点需要注意。依次输出span1 ... span5    // alert($(this).html()); //输出结果同上 只是$(this)会将元素转为jQuery对象    if($(this).html() == "span4")      return false;      //可以提前使用return 退出循环  });《script》
<script type="text/javascript">  // alert($("p span").size());  //输出结果5 size()函数是获取jQuery集合中元素的个数《script》
<script type="text/javascript">  // alert($("p span").length);  //输出结果5 当前匹配的元素个数.同size 返回相同的值《script》
<script type="text/javascript">  $("#ul1")   .append("
" + $("ul").selector + "
")   .append("
" + $("ul li").selector + "
")   .append("
" + $("p#foo ul:not([class])").selector + "
");《script》
<script type="text/javascript">  $("#ul2")   .append("
" + $("ul").context + "
")   .append("
" + $("ul", document.body).context.nodeName + "
");《script》
  get1  get2  get3  get4
<script type="text/javascript">  var spans = $("#get span");  var span1 = spans.get();  // alert(span1);  // 返回的是span元素的集合  // alert($(span1).html()); //输出结果get1 将节点元素包装成jQuery对象《script》
  get1  get2  get3  get4
<script type="text/javascript">  var spans = $("#get span");  var span1 = spans.get(0);  // alert(span1.innerText); //输出结果是get1 通过节点元素  // alert($(span1).html()); //输出结果同上   将节点元素包装成jQuery对象《script》
 
foo
 
bar
 
baz
<script type="text/javascript">  alert($('#ul8 li').index(document.getElementById('bar'))); //1，传递一个DOM对象，返回这个对象在原先集合中的索引位置  alert($('#ul8 li').index($('#bar'))); //1，传递一个jQuery对象  alert($('#ul8 li').index($('#ul8 li:gt(0)'))); //1，传递一组jQuery对象，返回这个对象中第一个元素在原先集合中的索引位置  alert($('#bar').index('#ul8 li'));   //1，传递一个选择器，返回#bar在所有li中的做引位置  alert($('#bar').index()); //1，不传递参数，返回这个元素在同辈中的索引位置。《script》

运行结果

总结

本篇是介绍jQuery的对象访问模块。以前没有系统的学习jQuery，现在打算系统的学习下jQuery，顺便贴出供需要的朋友参考。如果哪里不对的地方，欢迎指正，谢谢大家的阅读！