javascript - 如何将html转换为javascript中的变量？

Question

我在将 html 转换为 javascript 变量时遇到问题。

我的 HTML 代码

<div onclick="openfullanswer('2','Discription part','This is the code part');">

我想动态创建这个 html 代码，但我在 quote("and ') 中遇到了问题

我试过如下

for(i=0;i<result.length;i++)
{       
        strVar +="<div onclick='openfullanswer("+result[i].ReplyID+",'"+result[i].Description+"','"+result[i].Code+"');'>Test code</div>";
}

https://jsfiddle.net/8782n60z/1/

Answer 1

方式一: 您应该必须更改单引号和双引号的顺序，并且必须在单击函数参数中使用“\”转义单引号

请检查以下代码段以获得更多理解。

var result=[];
var obj=new Object();
obj.ReplyID=1;
obj.Description="This is my description";
obj.Code="This is my Code Part";

result.push(obj);



strVar="";
for(i=0;i<result.length;i++)
{       
  strVar +='<div onclick="openfullanswer(\''+result[i].ReplyID+'\',\''+result[i].Description+'\',\''+result[i].Code+'\');">Test code</div>';
}

document.getElementById("test").innerHTML=strVar;


function openfullanswer(replyid,desc,code)
{
  alert("success");

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test">

</div>

方式二: 不要改变引号的顺序。 只需将 onclick 事件声明引号从单引号更改为双引号并使用“\”转义双引号，您无需更改任何内容。

请检查以下代码段以获得更多理解。

var result=[];
var obj=new Object();
obj.ReplyID=1;
obj.Description="This is my description";
obj.Code="This is my Code Part";

result.push(obj);


strVar="";
for(i=0;i<result.length;i++)
{       
    strVar +="<div onclick=\"openfullanswer("+result[i].ReplyID+",'"+result[i].Description+"','"+result[i].Code+"');\">Test code</div>";
}

document.getElementById("test").innerHTML=strVar;


function openfullanswer(replyid,desc,code)
{
alert("success");

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test">

</div>