删除html模板实例

我有一个应用程序（FreeCodeCamp项目），其中Twitch账户列表显示为在线或离线。删除html模板实例

我使用的表从形式

<template id="new-row"> 
    <td class="account-data logo"></td> 
    <td class="account-data name"></td> 
    <td class="account-data status></td> 
    ... 
    </template>

的模板的情况下，取得这样的每一行是模板的唯一实例。

我需要能够清除表格并重新打印。

任何形式的.removeChild或.remove方法都会删除模板本身而不是实例或者什么也不做。

这里有没有其他的选择？

来源

2015-11-19 Steve Paytosh

最简单的方法是将模板存储在一个变量中，以避免移除。其他方式包括创建一个标签来包含模板内容。

<script type="template/html" id='myTemplate'> 
    <td class="account-data logo"></td> 
    <td class="account-data name"></td> 
    <td class="account-data status"></td> 
</script>

现在你可以使用下面的代码来获取模板

var template = $("#myTemplate").text();

我们填充表

function populateTableRows(rows) { 
    var tbody = $("#myTable tbody"); 

    for(var i = 0; i < rows.length; i++) { 
     var currentRow = rows[i]; 
     var row = $("<tr>" + template + "</tr>"); 
     row.find("td:eq(0)").text(currentRow.logo); 
     row.find("td:eq(1)").text(currentRow.name); 
     row.find("td:eq(2)").text(currentRow.status); 

     tbody.append(row); 
    } 
}

清台

function clearTableRows() { 
    var tbody = $("#myTable tbody"); 
    tbody.html(""); 
}

要使生活更容易，你可以使用一些温度lating库，一些例子是

来源

2015-11-19 02:25:22 11thdimension

谢谢，这有助于很多。我最终不得不用我的列标题重复附加过程，因为它们被表格行删除。我也不得不使用.html而不是.text，因为我在表格中嵌套了元素，我没有在原始问题中写出。 –

也许调用.show()或.hide()函数会工作吗？这或创建一个类来显示和隐藏你想要的，并使用JavaScript来添加类或删除它。

来源

2015-11-19 02:13:36

我这个做了尝试，但没有好。我认为这个问题是我无法访问模板的实例。 –

删除html模板实例

回答

相关问题