如何提取html并将它们添加到数组中?

时间:2013-07-25 19:57:13

标签: javascript jquery html

我对我的上一篇文章有​​疑问

How to extract texts from html markup

Oriol的回答帮助我分离了表结构之间的html标记。

然而,还有另一个问题。

var project =[''];

$('#htmlData').contents().each(function(){
    if($(this).is('table')){
         //do something with table
         project.push['end of table'];  //this line of codes is the problem....
    }else{
        project[project.length-1] += (
            this.nodeType === 3  ?  $(this).text()  :
            (this.nodeType === 1  ?  this.outerHTML  :  '')
        );
    }
});

for(var i=0; i<project.length; ++i){
    project[i] = project[i].replace(/\s+/g,' ') // Collapse whitespaces
    .replace(/^\s/,'') // Remove whitespace at the beginning
    .replace(/\s$/,''); // Remove whitespace at the end
}

假设我有html个数据,如下所示

<em>first part</em> of texts here

    <table>
    ......
    ......
    </table>

<em>second part</em> of texts

我的项目数组最终如下:

 //2 elements
    ('<em>first part</em> of texts here','end of table <em>second part</em> of texts) 

但我希望的结果是

  //3 elements
    ('<em>first part</em> of texts here','end of table','<em>second part</em> of texts) 
如果选择器end of tablearray标记,

loop就是table推送的内容。

我如何做到这一点?谢谢你的帮助!

1 个答案:

答案 0 :(得分:1)

问题是您在处理完表后没有在数组中创建新位置。在这种情况下,project.length-1将始终引用“end of table”位置,因此它只是将下一个“非表”数据与它连接起来。

试试这个:

    var project =[''],
    j = 0;

$('#htmlData').contents().each(function(){
    if($(this).is('table')){
         //do something with table
         project.push('end of table');  //this line of codes is the problem....
         j=project.length;
    }else{
        if (project[j] == undefined) project[j] = "";
        project[j] += (
            this.nodeType === 3  ?  $(this).text()  :
            (this.nodeType === 1  ?  this.outerHTML  :  '')
        );

    }
});
for(var i=0; i<project.length; ++i){
    project[i] = project[i].replace(/\s+/g,' ') // Collapse whitespaces
    .replace(/^\s/,'') // Remove whitespace at the beginning
    .replace(/\s$/,''); // Remove whitespace at the end
}
console.log(project);

我确信有一种更干净的方式,但这应该会给你一个想法。