jquery学习进阶使用

作者：Guff_9hys | 2024-07-16 13:33:12

踩

学习进阶

Jquery的遍历

Jquery的遍历-获取父节点

举例：

<div>div (曾祖父)

<ul>ul (祖父)

<li>li (直接父)

</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() 方法会释放会 $ 标识符的控制，这样其他脚本就可以使用它了。

$.noConflict();

jQuery(document).ready(function(){

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

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

});

</script>

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Guff_9hys/article/detail/834395