试图删除嵌套标签

Question

我有以下HTML：

<div class="item">
     <div class="appIcon">
        <img src="img/espn-hex2.png" alt="ESPN" />
    </div>
    <div class="appDetails">
        <h2>ESPN<small> SUMMER 2013, Bristol, CT</small></h2>
        <p class="info">I was chosen for a Summer 2013 internship at ESPN, in Bristol, Connecticut. This was a dream come true opportunity for me since it combined my love of sports with my love of web development. I was part of the dotcom team which maintains the overall website. Specifically, I was part of the live events team. We handled creating pages for live games, home run derby, the Sportscenter mobile app, and many other things.</p>
        <br />
    </div>
</div>

我正在尝试根据<h2>文本动态生成滑块指示器工具提示（这样我就不必维护这个无限长的列表）。我只对导致<small/>标签的文本感兴趣。我尝试了以下操作：

$(".item").eq(count).find("h2").clone().find("small").remove().text(); //count is for loop iterator to loop through all slides

然而，这并没有奏效。我在JS方面不是很先进，所以有人能指出我正确的方向吗？

Answer 1

你的意思是：

var a = $(".item");
a.find("small").remove();
console.log(a.text());

演示:: jsFiddle

Answer 2

你必须使用end()：

这样做

HTML

<h2>ESPN<small> SUMMER 2013, Bristol, CT</small></h2>

JQUERY

console.log($("h2").clone().find("small").remove().end().text());

EXAMPLE FIDDLE

更新的HTML：

<div class="item">
    <div class="appIcon">
        <img src="img/espn-hex2.png" alt="ESPN" />
    </div>
    <div class="appDetails">
         <h2>ESPN<small> SUMMER 2013, Bristol, CT</small></h2>

        <p class="info">I was chosen for a Summer 2013 internship at ESPN, in Bristol, Connecticut. This was a dream come true opportunity for me since it combined my love of sports with my love of web development. I was part of the dotcom team which maintains the overall website. Specifically, I was part of the live events team. We handled creating pages for live games, home run derby, the Sportscenter mobile app, and many other things.</p>
        <br />
    </div>
</div>

JQUERY：

console.log($(".item").find("h2").clone().find("small").remove().end().text());

FIDDLE WITH UPDATED HTML