Question

我的页面上有一个隐藏的div，我只想获得HTML结构。

<div class="html-to-store visuallyhidden">
    <span class="item">
        <p>Test</p>
        <p>Another Test</p>
    </span>
    <span class="item">
        <p>Second Test</p>
        <p>Dadada</p>
    </span>
</div>

和我的JavaScript：

var storeThis = $('.html-to-store').html();

现在，这很好，但我希望能够在一行中获取所有HTML标记。

这是what I'm currently getting：

<span class="item">
    <p>Test</p>
    <p>Another Test</p>
</span>
<span class="item">
    <p>Second Test</p>
    <p>Dadada</p>
</span>

我想要的是以下内容：

<span class="item"><p>Test</p><p>Another Test</p></span><span class="item"><p>Second Test</p><p>Dadada</p></span>

Answer 1

一些原油正则表达怎么样？拆分并加入，删除空格。

Javascript RegExp replace with negative lookahead

var storeThis = $('.html-to-store').html().split(/>[\s]*</g).join('><');

http://jsfiddle.net/t8zRJ/3/

Answer 2

用于此目的的小型jQuery插件：

(function( $ ){
    $.fn.getUnformattedText = function () {
        return $.trim($(this).html()
                  .split(/\>[\n\t\s]*\</g).join('><')
                  .split(/[\n\t]*/gm).join(''));
    }
})( jQuery );

<强>用法：

$('.html-to-store').getUnformattedText();

<强>小提琴：

http://jsfiddle.net/marionebl/t8zRJ/10/

Answer 3

解决方案是删除所有空白文本节点，请尝试

$(function () {
    $('.html-to-store').contents().contents().addBack().filter(function () {
        return this.nodeType == 3 && $.trim(this.nodeValye) == ''
    }).remove();

    var storeThis = $('.html-to-store').html();

    $('textarea').val(storeThis);

});

演示：Fiddle

如果您不想修改dom中的html结构，请使用像in here这样的克隆

从html（）变量中删除所有空格和制表符

3 个答案: