Javascript 动态选择最后一个子元素

假设我们从一个具有三个子div的父级开始，如下所示：

<div class="leftcolumn">
            <div id="post2" class="card post show"></div>
            <div id="post1" class="card post show"></div>
            <div id="post3" class="card post show"></div>
</div>

我希望将该选择器中的属性设置为最后一个子元素，该子元素只有“card”、“post”和“show”类。在开始时，该选择器选择我希望应用更改的元素，即id为“post3”的div

但是，假设子div的类发生了变化：

<div class="leftcolumn">
            <div id="post2" class="card post show"></div>
            <div id="post1" class="card post show"></div>
            <div id="post3" class="card post"></div>
</div>

我希望选择器选择并将更改应用到id为“post1”的子级，尽管它没有这样做

---

是否有一个特定的选择器可以按照我的要求工作？

首先，我可以看到您的选择器中有

.class

。没有

class

的

class

元素。您应该制作这张

卡

---

我认为你的建议不可能用简单的CSS选择器实现，你可能必须使用JavaScript或其他客户端脚本语言。

首先，我可以看到你的选择器中有

.class

。没有

class

的

class

元素。您应该制作这张

卡

---

我认为你的建议不可能用简单的CSS选择器实现，你可能必须使用JavaScript或其他客户端脚本语言。

看起来CSS不可能实现，但如果你想尝试一下jQuery：

$('.card.post.show').last().css("outline", "10px solid black");

---

希望能有所帮助。

看起来CSS不可能做到这一点，但如果您想尝试一下jQuery：

$('.card.post.show').last().css("outline", "10px solid black");

---

希望能有帮助。

噢，天哪，我本来想用“.card”而不是“.class”。打字错误我实施了你的解决方案，但没有成功。如果在3个主子div中的每一个都嵌套了多个div，这会不会不起作用？这是我应该提到的另一件事。选择leftcolumn的最后一个子项，然后用类名对其进行筛选，结果不匹配。可能是

.leftcolumn.card.post.show:：last child

？刚刚尝试过。没有骰子。也许这样的事情只能通过js脚本来完成_(ツ)_/“是的，这似乎是最好的。我会编辑我的答案。噢，天哪，我实际上是想用“.card”而不是“.class”.Typo。我实现了您的解决方案，但它不起作用。如果3个主子div中的每个都嵌套了多个div，它会起作用吗？这是我应该提到的另一件事。选择leftcolumn的最后一个子级，然后用类名对其进行筛选，结果不匹配。可能

。leftcolumn.card.post.show:：last child

？刚刚试过。没有骰子。也许像这样的事情只能通过js脚本来完成_(ツ)_/是的，这似乎是最好的。我会编辑我的答案。只是一个注释，因为在上面链接的dupe上的注释中很容易漏掉，您真正要找的是

n次匹配

，这是一个CSS4选择器，目前没有任何浏览器支持。所以您现在需要JavaScript来完成此操作。只是一个注释，因为它很容易被忽略在上面链接的dupe上的注释中，ss表示您真正需要的是

nth match

，它是一个CSS4选择器，目前没有任何浏览器支持。因此，您现在需要JavaScript来完成此操作。