Javascript 使用定义的类名获取下一个元素的html内容

我对jQuery有问题。如果我有此代码来填充工具提示div：

<div id="tooltip"></div>
<div class="tooltipMessage">Tooltip Message</div>
<script type="text/javascript">
    $("#id").html($("#tooltip").next(".tooltipMessage").html());
</script>

返回未定义的

我如何从下一个元素中提取HTML，用类名<代码> TooTyPrime>代码>如果中间存在另一个元素？

< P>替换

$("#id").html($("#id").next(".tooltipMessage").html());

与

.next（）

并不是在DOM中查找所需的所有内容，它实际上是在获取下一个元素

。find（）

将适合您

编辑：

我想这是可行的，我很快就看完了问题，觉得HTML是这样的

<div id="tooltip">
   <p>other element</p>
   <div class="tooltipMesage">Tooltip Message</div>
</div>

其他元素

工具提示消息

.find（）

将适用于所有Decedent元素

。如果您选择按问题中的方式保留HTML，则兄弟姐妹（）

将适用

.next()  -Wii get the immediate sibling 
        // Here the immediate sibling of tooltip is  p tag..
        // So it returns a empty selector because it not a immediate 
        // sibling

<div id="tooltip"></div>
<p>other element</p>
<div class="tooltipMesage">Tooltip Message</div>

或

使用.nextAll（）

---

为什么不将所有元素放在父容器中，并使用find（选择器）获取所需的元素？我认为这是一个更好的方法，可以给你一些防弹隔离

---

关于您的问题，您可以使用方法来查找所需的元素。

我以前解决过这个问题，方法是确保工具提示消息的id具有与其绑定的id相同的前缀，然后可以将javascript编写为

<div id="tooltip1"></div>
<div id="tooltip1Message" class="tooltipMessage>Tooltip Message</div>
<script type="text/javascript"> 
   $(".tooltipMessage").each(function(){
      var destId = $(this).attr("id").replace("Message","");
      $("#"+destId).html($(this).html());
    });
</script>

谢谢你，伙计，这很有效。9分钟后我可以接受你的回答。再一次，非常感谢。@Carasuman:这样行吗？如果有效，则您的HTML与问题中的HTML不同。@user1689607否，.find（）与.next（）不同，并对我有效…，发送一个否定消息，这是一种不好的态度。jQuery的
find（）
方法在当前选择器返回的节点内查找与传递给
find（）的选择器匹配的子体
方法。然而，在您发布的HTML中，
.tooltipMessage
不是任何元素的后代，我们仍然不知道哪个元素的
id
为
#id
（因为它也不在您发布的HTML中）。根据给定的HTML，如果使用.find（），则无法获取元素，如.find（）搜索选择器的子级，而不是同级。什么是
$（“#id”）
应该是？似乎您指的是工具提示，但您使用了不同的选择器。我可以建议您吗？这比使用chained
next（）
方法调用预测要遍历的同级数量要简单一些。
.next()  -Wii get the immediate sibling 
        // Here the immediate sibling of tooltip is  p tag..
        // So it returns a empty selector because it not a immediate 
        // sibling

<div id="tooltip"></div>
<p>other element</p>
<div class="tooltipMesage">Tooltip Message</div>

$("#id").html($("#id").next().next(".tooltipMessage").html());

$("#id").html($("#id").nextAll(".tooltipMessage").first().html());

<div id="tooltip1"></div>
<div id="tooltip1Message" class="tooltipMessage>Tooltip Message</div>
<script type="text/javascript"> 
   $(".tooltipMessage").each(function(){
      var destId = $(this).attr("id").replace("Message","");
      $("#"+destId).html($(this).html());
    });
</script>