如何在使用服务器端和javascript代码时避免冗余的HTML代码


How to avoid redundant HTML code when working with both serverside and javascript code

我有一个基本的列表项,它具有从数据库获取的值的ID属性。

我还使用jquery将相同的li元素附加到列表

我面临的问题是,如果我决定向li元素添加属性,我将不得不在服务器端代码和JavaScript代码上都这样做。

我不确定你们中是否有人遇到过这个问题并想出了一个解决方案。如果是这样,任何帮助都将非常感激。

下面是一个例子。这是我的php代码。这只是一个简单的示例,展示了我的真实代码

的样子。
<ul id="list_items">
foreach($todo_items as $todo_item{
   //Redundant html <li> tags... any change to the attributes I make here must be made in the jQuery code also to keep it consistent 
   echo "<li id='$todo_item->id'>$todo_item->item</li>";

}
</ul>
<script>
$(document).on("click",".add_todo", function(){
    $("add_new_item.php")
    .done(function(data){
      //A json return would come.. 
      //Redundant html li tags...
     $("#list_items").append("<li id='"+data.id+"'>Test</li>");
);
);
</script>

从php文件输出的代码是html的形式。您应该能够直接添加HTML代码,而不需要再次构建它。如果你想在客户端构建它,你不需要在php中回显html代码,你可以使用json_encode并发送值。

这取决于你是想生成你在服务器端还是客户端附加的HTML。

希望有帮助。

编辑:对不起,我第一次没看清楚你的代码。可能最简单的方法是使用$get/$post。然后它会调用服务器两次。但是您只需要在一个地方维护代码。