如何从Jquery获取完整的表格HTML？

Question

我正在尝试在jQuery中获取表格的HTML。

我有以下代码：

<table id='table' border='1'>
<tr><td>items...</td><td>items2...</td></tr>
<tr><td>items...</td><td>items2...</td></tr>
<tr><td>items...</td><td>items2...</td></tr>
<tr><td>items...</td><td>items2...</td></tr>
</table>

我有

var test = $('#table').html()

但是当我使用console.log(test)时，我得到了：

<tr><td>items...</td><td>items2...</td></tr>
<tr><td>items...</td><td>items2...</td></tr>
<tr><td>items...</td><td>items2...</td></tr>
<tr><td>items...</td><td>items2...</td></tr>

没有使用<table>标签。

有什么方法可以解决这个问题吗？非常感谢！

- FlyingCat

---

.html() 只检索指定标签内的内容。 - Stieffers

Answer 1

一个更加jQuery的方法是从表格中检索outerHtml属性。

 $('#table').prop('outerHTML')

- Stieffers

---

很好，我从未考虑过那种方法！ :) - David Thomas

这个能在旧版浏览器上运行吗？ - Blazemonger

@Blazemonger，我目前无法确认，但outerHtml()是一个得到广泛支持的JavaScript函数。 - Stieffers

Answer 2

一个选择是：

document.getElementById('table').outerHTML;

这里是JS Fiddle演示。

或者，您也可以选择：

$('<div />').html($('#table').clone()).html();

JS Fiddle demo.

- David Thomas

---

如果不必要，尽量不要使用jQuery。如果您想在jQuery中使用它：var table = document.getElementById('table').outerHTML; var jqueryTable = $(table); - Luuuud

Answer 3

另一个选择是将表格包装在其他元素中，然后获取该元素的html()。

示例标记：

<div class="wrapper">
    <table id='table' border='1'>
        <tr><td>items...</td><td>items2...</td></tr>
        <tr><td>items...</td><td>items2...</td></tr>
        <tr><td>items...</td><td>items2...</td></tr>
        <tr><td>items...</td><td>items2...</td></tr>
    </table>
</div>

还有jQuery:

var table = $('.wrapper').html();

你可能应该直接使用 @David Thomas 的答案。

- grammar