javascript - 双引号被替换为 "

Question

我的 JavaScript 变量包含一个字符串:

{"start":{"lat":19.0759842,"lng":72.87765630000001},"end":{"lat":18.5206624,"lng":73.8567415},"waypoints":[[18.8753235,73.52948409999999]]}

但是当我将它显示到 HTML 组件中时，它看起来像:

{"start":{"lat":19.0759842,"lng":72.87765630000001},"end":{"lat":18.5206624,"lng":73.8567415},"waypoints":[[18.8753235,73.52948409999999]]}

Answer 1

将字符串输出为 HTML 而不是纯文本，以便正确呈现 HTML 实体 "。

var s = "{"start":{"lat":19.0759842,"lng":72.87765630000001},"end":{"lat":18.5206624,"lng":73.8567415},"waypoints":[[18.8753235,73.52948409999999]]}";

//Incorrect with jQuery
$("#incorrect-jquery").text(s);

//Correct with jQuery
$("#correct-jquery").html(s);

//Incorrect with plain JavaScript
document.getElementById("incorrect-js").textContent = s;

//Correct with plain JavaScript
document.getElementById("correct-js").innerHTML = s;

div {
  margin-bottom: 20px;
}

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

<strong>Incorrect with jQuery</strong>
<div id="incorrect-jquery"></div>

<strong>Correct with jQuery</strong>
<div id="correct-jquery"></div>

<strong>Incorrect with plain JavaScript</strong>
<div id="incorrect-js"></div>

<strong>Correct with plain JavaScript</strong>
<div id="correct-js"></div>