清除 HTMLTableElement 的内容
Clearing contents of HTMLTableElement
我有以下 table 元素:
<table id="my-table" class="table table-striped table-hover ">Loading...</table>
我在 ajax 调用中动态创建 table,然后将数据写入 table:
<script>
$.ajax({
success:function(result){
$.getScript("table-sort-controller.js", function () {
sortTable("my-table")
}); //makes table sortable using DataTables
$.getScript("search-controller.js"); //makes table searchable using DataTables
},
url: "http://myserver:8080/url/"
}).then(function(data) {
var table = "<thead>";
table += createTableHeader(data); //fake method to simplify code
table += "</thead>";
table += "<tbody id='sortable-cells'>";
table += createTableBody(data); //fake method to simplify code
table += "</tbody>";
//This is the line where I try to clear "Loading...".
document.getElementById("my-table").innerHTML = table;
});
</script>
但是,我无法从已加载的 table 上删除 "Loading..."
。我在 table 创建后直接在行中尝试了以下内容:
document.getElementById("my-table").innerHTML = "";
document.getElementById("my-table").empty();
//a few other attempts I cannot remember
更多信息:
alert(document.getElementById("my-table")); //output is [object HTMLTableElement]
alert(document.getElementById("my-table").innerHTML); //output is empty alert
alert(document.getElementById("my-table").getCaption()); //console says "undefined is not a function"
我不清楚为什么 getCaption()
returns 未定义,因为它似乎是 W3C.
下的函数
如何在我的 table 完成加载后和用适当的 HTML 填充 #my-table
之前删除 "Loading..."
?或者,如何在写 table 后立即删除 "Loading..."
?
感谢@Phylogenesis 和@Paul Roub,修复了它!
我改了
<table id="my-table" class="table table-striped table-hover ">Loading...</table>
至
<table id="my-table" class="table table-striped table-hover "><tr><td>Loading...</td></tr></table>
然后我添加了以下内容以删除我的旧 "Loading..."
。
$('#my-table').empty();
现在可以了。谢谢!
编辑:在我的特殊情况下,我实际上能够完全删除清除调用,因为我在下一行中覆盖了元素。
我有以下 table 元素:
<table id="my-table" class="table table-striped table-hover ">Loading...</table>
我在 ajax 调用中动态创建 table,然后将数据写入 table:
<script>
$.ajax({
success:function(result){
$.getScript("table-sort-controller.js", function () {
sortTable("my-table")
}); //makes table sortable using DataTables
$.getScript("search-controller.js"); //makes table searchable using DataTables
},
url: "http://myserver:8080/url/"
}).then(function(data) {
var table = "<thead>";
table += createTableHeader(data); //fake method to simplify code
table += "</thead>";
table += "<tbody id='sortable-cells'>";
table += createTableBody(data); //fake method to simplify code
table += "</tbody>";
//This is the line where I try to clear "Loading...".
document.getElementById("my-table").innerHTML = table;
});
</script>
但是,我无法从已加载的 table 上删除 "Loading..."
。我在 table 创建后直接在行中尝试了以下内容:
document.getElementById("my-table").innerHTML = "";
document.getElementById("my-table").empty();
//a few other attempts I cannot remember
更多信息:
alert(document.getElementById("my-table")); //output is [object HTMLTableElement]
alert(document.getElementById("my-table").innerHTML); //output is empty alert
alert(document.getElementById("my-table").getCaption()); //console says "undefined is not a function"
我不清楚为什么 getCaption()
returns 未定义,因为它似乎是 W3C.
如何在我的 table 完成加载后和用适当的 HTML 填充 #my-table
之前删除 "Loading..."
?或者,如何在写 table 后立即删除 "Loading..."
?
感谢@Phylogenesis 和@Paul Roub,修复了它!
我改了
<table id="my-table" class="table table-striped table-hover ">Loading...</table>
至
<table id="my-table" class="table table-striped table-hover "><tr><td>Loading...</td></tr></table>
然后我添加了以下内容以删除我的旧 "Loading..."
。
$('#my-table').empty();
现在可以了。谢谢!
编辑:在我的特殊情况下,我实际上能够完全删除清除调用,因为我在下一行中覆盖了元素。