gpt4 book ai didi

javascript - 折叠所有以下元素直到特定标签

转载 作者:太空宇宙 更新时间:2023-11-04 04:21:50 25 4
gpt4 key购买 nike

我有一个带有顶升标记的常见问题解答,如下所示:

<p><strong>How can I come see the animals perform?</strong><br>
Schedules and information about attending a performance can be found here:</p>
<p><a href="http://jupmingdolphins.com">Performance tickets</a></p>
<p>If no performances are listed, it means that none are scheduled in the
near future. The animals take a break between November and May.</p>

<p><strong>What's the answer to this question?</strong><br>
It's 42, of course.</p>

<h2>Header for More Questions</h2>

<p><strong>Is it true the dolphins have smartphones?</strong><br>
Yes, they use Android phones and text each other constantly.</p>
<p><b>Just kidding!</b> They are all Apple fan-fish and prefer iPhones.</p>

(etc)

我想弄清楚:

  1. 一些 CSS(可能还有 jQuery)用于在页面加载时隐藏除问题之外的所有内容。

  2. 简单的 jQuery,当用户点击 <strong> 时-wrapped 问题,答案向下滑动并显示在其下方。如您所见,问题是标记很古怪(多亏了 CMS),一个问题和另一个问题之间可能有很多东西。答案没有包含在它们自己的 DIV 或其他任何东西中。最重要的是,整个常见问题解答中都有 H2 副标题,我不希望 H2 被触及/折叠。

所以我需要类似于点击操作的代码:

$('strong').click(function() {
// hide or reveal all elements from $(this) down,
// and stop when we hit next <strong> or <h2>
});

最佳答案

编辑

问题甚至没有自己的标签,这让事情变得非常复杂。因此,您处于需要隐藏问题的父标签但显示问题本身的尴尬境地,这基本上是不可能的。

要解决这个问题,here is a hack我拼起来的它克隆问题并将它们附加到自己的标签中。但是,我建议尝试说服此标记的作者将其修改为更合理的内容。


要隐藏非问题,看起来你可以使用类似的东西:

$("#container").children().not($("strong").parent()).not("p").hide();

要显示答案,您可以使用 nextUntil :

$(this).parent().nextUntil($("strong").parent()).show();

FIDDLE

关于javascript - 折叠所有以下元素直到特定标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18924284/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com