如何使用jQuery正确打印HTML中的变量

我正在使用以下函数打印出javascript变量的内容。如何使用jQuery正确打印HTML中的变量

function message(){ 
     $("#description").html("Candidate " + (lowest+1) + " was the first to get eliminated ending on " + results[lowest][0]+ "%"); 

    }

这正确正常工作，但是如果我试试这个：

function message(){ 
    $("#description").html("Candidate " + (lowest+1) + " was the first to get eliminated ending on " + results[lowest][0]+ "%"); 
    $("#description").html("Candidate " + (lowest2+1) + " was the second to get eliminated ending on " + results[lowest2][0]+ "%"); 

    }

这显然是行不通的。第二条消息覆盖第一条消息的文本。什么是正确的方式显示这两个消息。

来源

2012-03-14 kishan patel

function message(){ 
    var output; 
    output = "Candidate " + (lowest+1) + " was the first to get eliminated ending on " + results[lowest][0]+ "%"; 
    output += "Candidate " + (lowest2+1) + " was the second to get eliminated ending on " + results[lowest2][0]+ "%"; 
    $("#description").html(output); 

    }

保持DOM操作尽可能少的性能的缘故（它会为你节省不必要的页面重新绘制）：只使用一个变量包含您的所有字符串，并做插入一次，所以要避免多重昂贵调用jQuery函数。

来源

2012-03-14 16:57:02 fcalderan

使用.append()：

function message(){ 
    $("#description").append("Candidate " + (lowest+1) + " was the first to get eliminated ending on " + results[lowest][0]+ "%"); 
    $("#description").append("Candidate " + (lowest2+1) + " was the second to get eliminated ending on " + results[lowest2][0]+ "%"); 

    }

来源

2012-03-14 16:57:04 ComFreek

html()方法将取代所有的都选择....我想你想append()这更增加了结束现有的HTML

来源

2012-03-14 16:58:26 charlietfl

您需要添加的，而不是取代显示元素的html。

因此，像这样：

$("#description").append("Candidate " + (lowest+1) + " was the first to get eliminated ending on " + results[lowest][0]+ "%" + "<br />");

.append()可以采取一个jQuery对象，原生DOM元素，或者普通的HTML字符串。

根据您的实际数据是如何结构化的，更强大的方法是建立一个DOM片断，然后它添加到容器：

function message(){ 
    $('<div class="result">').html(_your_message_here_).appendTo('#description'); 
    $('<div class="result">').html(_next_message_here_).appendTo('#description'); 
}

然后，你可以根据需要样式div.result，不用担心换行等

来源

2012-03-14 16:58:44

使用

$("#description").html("Candidate " + (lowest+1) + " was the first to get eliminated ending on " + results[lowest][0]+ "%"); 
    $("#description").append("Candidate " + (lowest2+1) + " was the second to get eliminated ending on " + results[lowest2][0]+ "%");

来源

2012-03-14 16:59:08

如何使用jQuery正确打印HTML中的变量

回答

相关问题