如何在.append()函数中添加巨大的html?

时间:2016-10-17 13:15:57

标签: jquery append

.append的问题在于我必须像这样写一行:

$('#addr' + (i - 1)).append("<td>" + i + "</td><td><input id='riferimento_" + i + "' name='riferimento_" + i + "' type='text' placeholder='RIFERIMENTO' class='form-control riferimento'  /></td><td><input id='host_" + i + "' name='host_" + i + "' type='text' placeholder='HOST' class='form-control host'  /></td><td><input id='user_" + i + "' name='user_" + i + "' type='text' placeholder='USER' class='form-control user'  /></td><td><div class='opzioni' id='opzione" + i + "'>  <p id='infotime_" + i + "' class='pull-left'><p>  <a href='#' id='" + i + "' class='btn btn-danger  btn-circle  pull-right btn_delete_row'> <span class='glyphicon glyphicon-trash'></a> <a style='margin-right: 8px;' href='#' data-popup-open='popup_" + i + "' class='btn btn-info btn-circle pull-right more_info '><span class='glyphicon glyphicon-info-sign'></span></a> <a hidden style='margin-right: 8px;' href='#' key='" + i + "' id='update_row_db_" + i + "' class='btn btn-primary btn-circle pull-right update_row_db '><span class='glyphicon glyphicon-pencil'></span></a>  <a hidden style='margin-right: 8px;' href='#' key='" + i + "' id='add_row_db_" + i + "' class='btn btn-success btn-circle pull-right add_row_db '><span class='glyphicon  glyphicon-save'></span></a> </div></td>");

我如何使用breaklines并格式化html,如下所示:

$('#addr'+(i-1)).append("
    <div>
        <p></p>
    </div>
");

我希望代码更具可读性,以便进行进一步的更改。也许我以错误的方式看问题,你知道另一种方式吗?

2 个答案:

答案 0 :(得分:1)

您可以执行以下操作: -

class Des
{
   int id;
   string name;
   int thisisinteresting;
}

&#34 ;;

最后

var htmlToAppend;
htmlToAppend="<td>"+ i +"</td>";
htmlToAppend=htmlToAppend+"<td><input id='riferimento_"+i+"' name='riferimento_"+i+"' type='text' placeholder='RIFERIMENTO' class='form-control riferimento'/>";
htmlToAppend=htmlToAppend+"</td>";
htmlToAppend=htmlToAppend+"<td><input id='host_"+i+"' name='host_"+i+"' type='text' placeholder='HOST' class='form-control host'  /></td>";
htmlToAppend=htmlToAppend+ "<td><input id='user_"+i+"' name='user_"+i+"' type='text' placeholder='USER' class='form-control user'  /></td>

使其更具可读性

答案 1 :(得分:1)

  

Google's JavaScript style guide建议使用字符串连接   而不是转义换行符:

     

var myString ='<div>   '+
        '<p> Hello World</p>'+         '<p> Use this style </p>'+         '</div>';

来源:https://stackoverflow.com/a/6247331/3704861