jquery学习进阶使用

来源:互联网 发布:python单元测试框架 编辑:程序博客网 时间:2024/06/18 17:44

Jquery的遍历

Jquery的遍历-获取父节点

举例:

<div>div (曾祖父)

   <ul>ul (祖父) 

     <li>li (直接父)

       <span>span</span>

     </li>

</ul>  

</div>

parent() 方法返回被选元素的直接父元素。$("span").parent();获得li

parents() 方法返回被选元素的所有祖先元素(包括父节点和html),它一路向上直到文档的根元素 (<html>)。$("span"). parents (); 获得 html-body-div-ul-li

parentsUntil() 方法返回介于两个给定元素之间的所有祖先元素。

$("span").parentsUntil("div");返回ul-li

Jquery的遍历-获取同级节点

siblings() 方法返回被选元素的所有同胞元素。

next() 方法返回被选元素的下一个同胞元素。

nextAll() 方法返回被选元素的所有跟随的同胞元素。

nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素。 (不包括h2和h6)

$("h2").nextUntil("h6").css({"color":"red","border":"2pxsolid red"});意思是说h3-h4-h5加上红线外边框

prev(), prevAll() 以及 prevUntil() 方法的工作方式与上面的方法类似,只不过方向相反而已:它们返回的是前面的同胞元素(在 DOM 树中沿着同胞元素向后遍历,而不是向前)。

Jquery的遍历-过滤

first() 方法返回被选元素的首个元素。$("div p").first();返回div的节点

last() 方法返回被选元素的最后一个元素。 $("div p").last();返回p的节点

eq() 方法返回被选元素中带有指定索引号的元素。$("p").eq(1);返回的是从body上面向下,以0为索引的第二个p元素的节点

也就是说,第二个p标签的节点

filter() 方法允许您规定一个标准。不匹配这个标准的元素会被从集合中删除,匹配的元素会被返回。$("p").filter(".test");返回带有test类的p标签的节点

not() 方法返回不匹配标准的所有元素。not() 方法与 filter() 相反。$("p").not(".test");返回p标签不带test的类的节点

Jquery的遍历-AJAX技术

在不加载全部网页的情况下更新部分网页部分的内容如 视频网站

$(selector).load(URL,data,callback);

必需的 URL 参数规定您希望加载的 URL。

可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

可选的 callback 参数是 load() 方法完成后所执行的函数名称。

$.get() 方法通过 HTTP GET 请求从服务器上请求数据。$.get(URL,callback);

必需的 URL 参数规定您希望请求的 URL。

可选的 callback 参数是请求成功后所执行的函数名。

下面的例子使用 $.get() 方法从服务器上的一个文件中取回数据:$.post() 方法通过 HTTP POST 请求从服务器上请求数据。

$.post(URL,data,callback);

必需的 URL 参数规定您希望请求的 URL。

可选的 data 参数规定连同请求发送的数据。

可选的 callback 参数是请求成功后所执行的函数名。

下面的例子使用 $.post() 连同请求一起发送数据:

JquerynoConfict()方法

noConflict() 方法会释放会 $ 标识符的控制,这样其他脚本就可以使用它了。

<script>

$.noConflict();

jQuery(document).ready(function(){

 jQuery("button").click(function(){

   jQuery("p").text("jQuery 仍在运行!");

  });

});

</script>

 

 

 

0 0