Question

如果我将http.responseText存储在javascript变量中，例如名为sourcecode，其中包含页面的整个源代码，我想从中将表标记之间的所有内容提取到javascript变量中，我该怎么做？ html代码如下所示：

<table border="0" width="100%" cellspacing="0" cellpadding="0" class="statusbox_ok" style="margin-top: 5px; margin-bottom: 5px">
    <tbody><tr>
        <td align="left" valign="top"><img src="http://www.10eastern.com/images/FoundPhotos/archives/archive118/dasdsa.jpg" style="margin: 2px; margin-right: 10px"></td>
        <td align="left" valign="middle" width="100%">
        Your new username is Tom.   </td>
    </tr>
    </tbody></table>

我想至少能够提取：

<td align="left" valign="middle" width="100%">
            Your new username is Tom.   </td>

如果它包含tbody或整个表格标签之间的所有内容并不重要，但该部分对于提取到javascript变量至关重要。如果没有jquery我该怎么做？感谢。

Answer 1

<强>更新

使用this article，我读到了DOMParser()，它允许您使用Javascript将字符串解析为DOM元素。使用.parseFromString()，我能够将HTML字符串解析为DOM元素。

var html = '<html><table /></html>'; // Your source code
html = new DOMParser().parseFromString(html, "text/html");

请确保使用document.getElementsByTagName('table')更新html.getElementsByTagName('table')，因为我们现在正在查找解析后的字符串中的表而不是文档。

更新了JSFiddle。

我避免使用RegEx，因为HTML不是常规语言而是you shouldn't use regular expressions to match it。此外，还有足够的纯Javascript函数来完成您的任务。

var tables = document.getElementsByTagName('table');
for(var tableIt = 0; tableIt < tables.length; tableIt++) {
    var table = tables[tableIt];
    if(table.className === 'statusbox_ok') {
        var columns = table.getElementsByTagName('td');
        for(columnIt = 0; columnIt < columns.length; columnIt++) {
            var column = columns[columnIt];
            console.log(column.innerHTML);
        }
    }
}

我使用.getElementsByTagName()遍历所有表格元素。然后检查.className以确保它是您的statusbox_ok表格。我们再次使用.getElementsByTagName()遍历所有列。你可以在这里使用一些逻辑来确定你想要的列（类似于我们对表的类所做的那样），但随后我用.innerHTML记录了每列的HTML内容。

查看此JSFiddle以获取有效工作示例。

Javascript解析HTML：获取表标记内的所有内容

1 个答案: