javascript - 从其他页面查找所有 h2 + span 中的文本并使用 jquery 附加到不同页面

Question

我正在为一个简单的 HTML 游戏构建一个附加组件。我想在一个页面上显示不同页面中的一些项目，以便更轻松地玩游戏。我使用 get 从其他页面获取 HTML，然后使用 find() 获取包含文本的 h2 > spans 。不幸的是，它不仅只获取第一个 h2 + span 组合，而且还在第一个组合内显示附加 span 的 HTML 标签。页面上有多个 h2> span，用于玩家访问的不同城市，如果可能的话，我只想抓取包含文本 you have

的内容

我从中获取值的页面的 h2 元素之一的 HTML 是:

<h2>Planet X      
    <span style="margin-left:11px; font-size:12px;">
      You have 
       <span style="font-size:20px;">3</span>Small Keys                      
    </span>
</h2>

我将 html 保留为困惑状态，以便您可以看到需要 trim 的所有额外空白/制表符。到目前为止我的代码如下:

if (document.URL.indexOf("missions.game") >= 0)
{
var missionstuff = document.getElementsByClassName("row")[0];
missionstuff.insertAdjacentHTML('beforebegin', ''+
'<div id="missionbits"><span id="missionstuff"></span></div>');

    $(function(){
    $.get('https://www.heroesrisinggame.com/game/vills.game', function(result){
        var obj = $(result).find("h2 span");
        $(this).append($('#missionstuff').text(obj.html().trim()));
    });
});
}

提前谢谢您!

Answer 1

将 obj.html() 更改为 obj.text()

编辑: 这是由于选择器: $("h2 span") 将选择两个范围，因此它将显示第一个范围的文本(您有 3 个小键)，后跟其中一个范围的文本第二个跨度 (3)。为了解决该问题，请仅选择父跨度，例如向其添加自定义类。

$("h2 span").first() 

会完成工作