jQuery中end()的定义与用法介绍

蔚落 2024-03-29 14:40 52阅读 0赞

转自：[微点阅读][Link 1] [https://www.weidianyuedu.com][Link 1]

**定义和用法**

end() 方法结束当前链条中的最近的筛选操作，并将匹配元素集还原为之前的状态。

以上是官方说法，比较难理解。

还是用一个例子来说明

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<p><span>Hello</span>,how are you?</p>

</body>

</html>

$("p").find("span")表示查找P元素下的SPAN元素

但是我想更改P的边框，这时我就要返回到P元素（即从SPAN返回到P,就是还原为之前的状态)

$("p").find("span").end()这个语句就返回来了。

$("p").find("span").end().css("border","2px red solid")把P的边框设置了。

\-------------------

对于end()方法，jQuery文档是这样解释的：jQuery回到最近的一个"破坏性"操作 之前。即:将匹配的元素列表变为前一次的状态。

但给的例子并不是很明显，相信不少人并没有理解它的用法。

下边我们以一个非常简单的例子来说明下用法，html代码如下：

<divid="test">

<h1>jQueryend()方法</h1>

<p>讲解jQuery中end()方法。</p>

</div>

JS代码：

$(document).ready(function()\{

$("\#test").click(function()\{

$(this).find("p").hide().end().hide();

\});

点击id为test的div时，首先找到div里边的[p标签][p]，将其隐藏。接下来使用end()方法结束了对p标签的引用，此时返回的是\#test(jQuery对象)，从而后边的hide()方法隐藏了div。这样相信大家已经理解了jQuery中end()方法。

\----------------------

<!--

$(function()\{

$("<input type="button" value="click me"/><input type="button" value="triggleclick me" /><input type="button"value="[detach][] handle" /><inputtype="button" value="show/hide text"/>").appendTo($("body"));

$("input\[type="button"\]").eq(0).click(function()\{

alert("youclicked me!");

\})

.end().eq(1).click(function()\{

$("input\[type="button"\]:eq(0)").trigger("click");

\})

.end().eq(2).click(function()\{

$("input\[typw="button"\]:eq(0)").unbind("click");

\})

.end().eq(3).[toggle][](function()\{

$(".panel").hide("slow");

\},function()\{

$(".panel").show("slow");

\});

\})

//-->

</script>

.panel\{

padding:20px;

background-color:\#000066;

color:\#FFFFFF;

font-weight:bold;

width:200px;

height:50px;

</style>

<div class="panel">welcome tojQuery!</div>

[Link 1]: https://www.weidianyuedu.com/
[margin]: https://so.csdn.net/so/search?q=margin&spm=1001.2101.3001.7020
[jquery]: https://so.csdn.net/so/search?q=jquery&spm=1001.2101.3001.7020
[p]: https://so.csdn.net/so/search?q=p%E6%A0%87%E7%AD%BE&spm=1001.2101.3001.7020
[detach]: https://so.csdn.net/so/search?q=detach&spm=1001.2101.3001.7020
[toggle]: https://so.csdn.net/so/search?q=toggle&spm=1001.2101.3001.7020