1

首先，FIDDLE。

是我项目的一部分，HTML里面的内容太多了，所以我只展示一下结构：

<div class="line">
<table>
    <tbody>
        <tr>
            <td>
                <font face="Arial">
                    <p>
                        <!--content-->
                        <br>
                        <!--content-->
                        <br>
                        <!--content-->
                        <br>
                        <!--content-->
                    </p>
                </font> 
            </td>
        </tr>
    </tbody>
</table>
</div>

这部分是我应该处理的内容。我应该做的是根据 将这张表拆分为多个<br>，并保留原始样式。也就是说，每个段落在无关表中应该是独立的。

下面的代码显示了我之前对那些最初使用<p>. 所以你应该已经知道我的意图了。

function split_func($div) {
    var $rows = $div.find("table tr td p");  // fail to detect tr in this demo
    n = $rows.length;  
    $rows.each(function(i) {            
        var $clone = $div.clone(true, true).insertAfter($div);
        $clone.find("table tr td p").each(function(j) {
            if(i !== (n-j-1)) $(this).remove();
        });
    });
    $div.remove(); 
}

带有注释的行是我应该组织提取功能的地方。你能告诉我如何解决这个问题吗？谢谢！

4

3 回答 3

0

上面的代码示例未能在您尝试查找的元素层次结构中指定 tbody 元素：

此外，我不建议使用 $ 符号作为变量的前缀，因为在使用 jQuery 库时这应该被视为保留字符。

var line_w = $(".line");      
for(var i = 0 ;i<line_w.length;i++){         
    if(line_w[i].getElementsByTagName('p').length){
        $(line_w[i]).each(function(i, div) {
            split_func($(div));
        });
    }
}


function split_func(div) {
    var rows = div.find("table tbody tr td p");  // fail to detect tr in this demo
    n = rows.length;
    rows.each(function(i) {            
        var clone = div.clone(true, true).insertAfter(div);
        clone.find("table tbody tr td p").each(function(j) {
            if(i !== (n-j-1)) $(this).remove();
        });
    });
    div.remove(); 
}
于 2013-07-10T06:25:06.687 回答
0

这将使您可以将每个段落拆分为自己的表格：

$('.line p').each(function(){
    var paragraphs = $(this).html().split('<br>');
    for(var i=0;i<paragraphs.length;i++){
        if(paragraphs[i]!= '') {       
             $(this).closest('table').clone().appendTo($(this).closest('.line')).find('p').html(paragraphs[i]);
        }                         
    }
});
$('.line table:first').remove();

jsFiddle在这里

于 2013-07-10T06:51:28.650 回答
0

你的意思是这样的？简单的方法，DEMO http://jsfiddle.net/yeyene/Rzz2n/8/

var output = $('.line p.Default').html();
output = output.replace(/\<br><br>/g, '</p></font></td></tr></tbody></table><table><tbody><tr><td><font face="Arial"><p>');
$('.line').html('<table><tbody><tr><td><font face="Arial"><p>'+output);
于 2013-07-10T06:51:35.640 回答