Question

我有一个表格，我在其中提取数据并将其添加到数组数组中。问题是如果其中一个表格单元格为空，则它在数组中显示为“未定义”。如果使用.pop（），我尝试使用if，如果最后一个元素是未定义的，则应删除该元素。我仍然得到未定义的元素。这是我的代码并且直播demo

HTML：

<table id="contactlisttable">
    <tr>
        <th>Name</th>
        <th>Title</th>
        <th>Phone</th>
    </tr>
    <tr>
        <td class="contactlist contactlistlastfirst">Joey</td>
        <td class="contactlist contactlisttitle">webdesigner</td>
        <td class="contactlist contactlistphone"></td>
    </tr>
    <tr>
        <td class="contactlist contactlistlastfirst">Anthony</td>
        <td class="contactlist contactlisttitle">webdesigner</td>
        <td class="contactlist contactlistphone">5555555</td>
    </tr>
</table>

JavaScript：

//IE9+ compatable solution
$(function(){
    var results = [], row; 
    $('#contactlisttable').find('th, td').each(function(){
        if(!this.previousElementSibling){ //New Row?
            row = []; 
            results.push(row); 
            if($(this) === 'undefined'){//Remove undefined elements
                row.pop();
            }
        }
        row.push(this.textContent || this.innerText); //Add the values (textContent is standard while innerText is not)       
    }); 
    console.log(results); 
});

Answer 1

的 jsFiddle Demo 的

不要使用条件语句，只需利用您的html结构。首先按表行选择，然后迭代子td或th元素。您还可以利用jQuery的text而不是进行功能检测。 jQuery的文本会更可靠。

var results = []; $('#contactlisttable tr').each(function(){ var row = []; $(this).find('td,th').each(function(){ row.push($(this).text()); }); results.push(row); }); console.log(results);

Answer 2

如果不匹配则不要推动和弹出，不要先推入。

从你的jsfiddle更新：

//IE9+ compatable solution
$(function(){
    var results = [], row; 
    $('#contactlisttable').find('th, td').each(function(){
        if(!this.previousElementSibling && typeof(this) != 'undefined'){ //New Row?
            row = []; 
            results.push(row); 
        }
        row.push(this.textContent || this.innerText); //Add the values (textContent is standard while innerText is not)       
    }); 
    console.log(results); 
});

Answer 3

您还可以避免以这种方式添加未定义（或实际为空）的元素：

$('#contactlisttable').find('th, td').each(function(){
    if(!this.previousElementSibling){ //New Row?
        row = [];
        results.push(row);
    }
    if(!(this.textContent == '')){
        row.push(this.textContent || this.innerText);            
    }
});

Answer 4

要知道某些内容是否未定义，请不要只与"undefined"进行比较，请使用typeof（）。

所以你想做：

if (typeof(this) === "undefined")

Answer 5

你可以添加一个紧凑的方法，如下划线和lodash ......

Array.prototype.compact = function() {
    return this.filter(function(x){
        return x !== undefined;
    });
}

console.log([1,2, '', undefined, 'e', undefined].compact()); // [ 1, 2, '', 'e' ]

你也应该为compact的原生实现添加一个检查，因为你用这个覆盖原生原型。

或者，只是

从数组中删除未定义的元素

5 个答案: