如何使用jQuery从HTML提取以下文本

Question

这是HTML代码..我想像这里一样提取...“具有令人印象深刻的设计，Magic Mouse 2完全可充电，因此您无需使用传统电池。它的重量更轻，由于其内置的部件，活动部件更少-内置电池和底部连续外壳，并具有优化的脚部设计-所有这些均可帮助Magic Mouse 2轻松跟踪并在桌面上以较小的阻力移动；多点触控表面使您可以执行简单的手势，例如在网页和桌面之间滑动滚动浏览文档。MagicMouse 2可以直接使用，并且可以与Mac自动配对

非常敏感的物品。”

 <div id = "ctl00_ContentPlaceHolderFull_productInfoTabUC_divOverview"> <p>.text 1</p> <p>.text 2</p> <p>.text 3</p> <p>.text 4</p> <h6 class="NoBottomMargin"></h6> "Featuring impressive design, Magic Mouse 2 is completely rechargeable, so you'll eliminate the use of traditional batteries. It's lighter, has fewer moving parts thanks to its built-in battery and continuous bottom shell, and has an optimized foot design - all helping Magic Mouse 2 track easier and move with less resistance across your desk. And the multi-touch surface allows you to perform simple gestures such as swiping between web pages and scrolling through documents. Magic Mouse 2 is ready to go right out of the box and pairs automatically with your Mac." <br> Very sensitive item. <br> <h6 class="NoBottomMargin">specifivation</h6> <ul> <li>Magic is in the multi-touch</li> <li>One or two, left or right</li> <li>Laser tracking engine</li> </ul> </div> 

Answer 1

首先，您应该将文本括在<p>标记中-因为它包含文本，并确保仅拾取特定元素-我向p添加了一个类，并使用.text（）定位了该类，还应该缩进您的代码以提高可读性。

 var requiredText = $(".getThisText").text(); console.log(requiredText) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id = "ctl00_ContentPlaceHolderFull_productInfoTabUC_divOverview"> <p>.text 1</p> <p>.text 2</p> <p>.text 3</p> <p>.text 4</p> <h6 class="NoBottomMargin"></h6> <p class="getThisText">"Featuring impressive design, Magic Mouse 2 is completely rechargeable, so you'll eliminate the use of traditional batteries. It's lighter, has fewer moving parts thanks to its built-in battery and continuous bottom shell, and has an optimized foot design - all helping Magic Mouse 2 track easier and move with less resistance across your desk. And the multi-touch surface allows you to perform simple gestures such as swiping between web pages and scrolling through documents. Magic Mouse 2 is ready to go right out of the box and pairs automatically with your Mac." <br> Very sensitive item. <br> </p> <h6 class="NoBottomMargin">specification</h6> <ul> <li>Magic is in the multi-touch</li> <li>One or two, left or right</li> <li>Laser tracking engine</li> </ul> </div> 

Answer 2

您可以使用nextSibling。

 console.log($($('.NoBottomMargin')[0].nextSibling).text()); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id = "ctl00_ContentPlaceHolderFull_productInfoTabUC_divOverview"> <p>.text 1</p> <p>.text 2</p> <p>.text 3</p> <p>.text 4</p> <h6 class="NoBottomMargin"></h6> "Featuring impressive design, Magic Mouse 2 is completely rechargeable, so you'll eliminate the use of traditional batteries. It's lighter, has fewer moving parts thanks to its built-in battery and continuous bottom shell, and has an optimized foot design - all helping Magic Mouse 2 track easier and move with less resistance across your desk. And the multi-touch surface allows you to perform simple gestures such as swiping between web pages and scrolling through documents. Magic Mouse 2 is ready to go right out of the box and pairs automatically with your Mac." <br> Very sensitive item. <br> <h6 class="NoBottomMargin">specifivation</h6> <ul> <li>Magic is in the multi-touch</li> <li>One or two, left or right</li> <li>Laser tracking engine</li> </ul> </div> 

Answer 3

我得到了答案：

if($("[id$='divOverview'] .NoBottomMargin").length){
        $("[id$='divOverview'] .NoBottomMargin").eq(0).nextUntil('.NoBottomMargin').each(function(){
            detail.description += "\n" + $(this)[0].previousSibling.nodeValue;
        });
    }