将html放入变量时保留缩进结构

我正在尝试使javascript函数能够在字符串中找到所有<td>标记，并使它们变为红色。这样我可以追踪一个缺乏他的comanion的错误标签</td>。我的问题是，当我复制一个页面的HTML时，它会失去所有的缩进结构。无论如何要保持这种结构？将html放入变量时保留缩进结构

$(document).ready(function(){ 
    var html = $('body').html(); 

    html.replace('<td>', '<td><span class="red">'); 
    html.replace('</td>', '</td></span>'); 
    $('#result').text(html); 
});

http://jsfiddle.net/KL3u3/2/

此外，字符串替换似乎并没有在所有的工作。但每次只有一件事。

感谢您的任何想法！

来源

2012-11-29 1252748

岂不是的'span'的'td'内，而不是倒退？ – Diego

@Diego是的，绝对。纠正。谢谢 – 1252748

@Diego但是，没有实际..因为这个想法是打印出来的HTML结构，把它变成文字（所以你实际上是在页面上看到内容），然后字符将是红色的。 – 1252748

$.ajax({ 
    url: document.location, 
    dataType: "html" // get plain source 
}).done(function(text) { 
    $(function() { 
     $("body").text(text).html(function(_, old) { 
      return old.replace(/&lt;\/?td&gt;/g, '<span class="red">$&</span>'); 
     }).css({"white-space":"pre-wrap", "text-align":"left", "font-family":"monospace"}); 
    }); 
});

来源

2012-11-29 17:55:37 Bergi

谢谢你，但它似乎并不为我工作http://www2.iscotest.com/test/getsource.html我是否执行了错误？ – 1252748

适用于我（在Opera中）。您是否遇到任何错误，您使用的是哪种浏览器？可能是一个实现 - 依赖序列化的'<td>'。为了安全的方式看看http://stackoverflow.com/a/10416898/1048572 – Bergi

对不起，Bergi，我不得不走出去一点，谢谢！您能告诉我，'_'和'old'从哪里来吗？ – 1252748

字符串替换仅替换第一个事件。要做全局替换，你需要使用正则表达式。

var html = $('body').html(); 
    html = html.replace(/(<td>)/gi, '<td><span class="red">'); 
    html = html.replace(/(<\/td>)/gi, '</span></td>'); 
$('#result').text(html);

FIDDLE

还要注意的是字符串替换是不变的，将必须重新申报回变量。

为什么不直接用jQuery包装TD呢？

$('body').find('td').wrap('<span class="red" />');

来源

2012-11-29 17:14:35 adeneo

这似乎是一个好主意，但不幸的是小提琴不适合我。：/ – 1252748

将html放入变量时保留缩进结构

回答

相关问题