JavaScript的HTML创建

Question

你好我将如何在Javascript中创建这个？：

You have <strong><span id="commentsCounter">${const['COMMENT_MAX_LENGTH']}</span></strong> characters left.<br/> 

添加上面这样的：

function editCommentToggle(id) 
{ 
    theRow = document.getElementById("id"+id); 
    //user = theRow.cells[0].innerHTML; 
    //date = theRow.cells[1].innerHTML; 
    com = theRow.cells[2].innerText ; 


    idx = 2; 
    maxlength = 250; 

       // Comment field 
     cell = theRow.cells[idx]; 
     while(cell.childNodes.length > 0) cell.removeChild(cell.childNodes[0]); 

     //spanTag = document.createElement("span"); 
     //spanTag.innerHTML = "id='commentsCounter'>" + maxlength + "</span>characters left.<br/>" 
     //cell.appendChild(spanTag); 
     element = document.createElement("textarea"); 
     element.id="comments-"+id; 
     element.rows="3"; 
     element.value = com; 
     element.style.width = "400px"; 
     element.maxLength = "250"; 
     element.onfocus = element.onkeydown = element.onkeyup = function(){return characterCounterEdit(undefined, maxlength, this);}; 
     cell.appendChild(element); 

     $(function() 
       { 
        setTimeout("syncCommentTableSizes()",0); <%-- Run after HTC code --%> 
       }); 

    // Actions field 
    cell = theRow.cells[++idx]; 
    while(cell.childNodes.length > 0) cell.removeChild(cell.childNodes[0]); 

    link = document.createElement("a"); 
    link.href = 'javascript:saveComment('+id+')'; 

    element = document.createElement("img"); 
    element.className = "edit"; // check if we need this changed 
    element.src="../images/icon_save.gif"; 
    element.border="0"; 
    element.alt = "Save"; 

    link.appendChild(element); 

    cell.appendChild(link); 
    cell.appendChild(document.createTextNode(" ")); 

    link = document.createElement("a"); 
    link.href = 'javascript:cancelCommentEdit('+id+')'; 

    element = document.createElement("img"); 
    element.className = "delete"; // check if we need this changed 
    element.src="../images/icon_cancel.gif"; 
    element.border="0"; 
    element.alt = "Cancel"; 

    link.appendChild(element); 
    cell.appendChild(link); 
} 

的jsp：

<table id="add-comment-table" class="data_table" style="border-top-style: none; margin-top: 0px;"> 
<td colspan="3"> 
    You have <strong><span id="commentsCounter">${const['COMMENT_MAX_LENGTH']}</span></strong> characters left.<br/> 
    <textarea id="comment" name="comment" rows="3" 
     onfocus="characterCounter('commentsCounter',${const['COMMENT_MAX_LENGTH']}, this)" 
     onkeydown="characterCounter('commentsCounter',${const['COMMENT_MAX_LENGTH']}, this)" 
     onkeyup="characterCounter('commentsCounter',${const['COMMENT_MAX_LENGTH']}, this)"></textarea> 
     <a href="javascript:addComment();"><img src="../images/icon_add.gif" border="0" alt="Add"/></a> 
</td> 

Answer 1

输出的不断隐藏的DIV中。

然后，您可以从html中获取innerHTML，而不是尝试通过javascript进行设置。

<div id="maxSize" style="display:none;">${const['COMMENT_MAX_LENGTH']}</div> 
<span id="commentsCounter"></span> 
<div onclick="update()">Click</div> 

<script> 
    function update() 
    { 
     var maxLength = parseInt(document.getElementById("maxSize").innerHTML); 
     document.getElementById("commentsCounter").innerHTML = maxLength; 
    } 
</script> 

Answer 2

你可以把这个html元素作为例子

elem.innerHTML = "your html generated code"; 

当然

使用单引号为HTML代码