所以，我有一个＆lt; p>标记在网页中，如下所示：
<p id="topProducts" style="text-align: center;"></p>
我想用这个替换它的内部：
<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>
我尝试在js脚本中执行此操作：
document.getElementById("topBar1").innerHTML = "<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>";
所以我会得到这个：
<p id="topProducts" style="text-align: center;"><div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div></p>
然而，这似乎并不奏效。有没有人有这方面的解决方案，我想重复这个过程到HTML页面中的其他两个项目。
答案 0 :(得分：3)
有2个错误：
Id。
您在文档中的ID（topProducts）与javascript标识topBar1不符，请使用document.getElementById("topProducts").innerHTML = '<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>';
以及有关getElementsById的更多内容：https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById
您的字符串包含需要转义的字符。
您的字符串包含尚未转义的内部双引号，这会混淆解析器。
"<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>";
将被解释为"<div style=" float: right "><span class="
glyphicon glyphicon-shopping-cart "></span><a href=" ../Cart.html ">カアート</a>    </div>" ;在字符串之间包含无效的Javascript代码。
由于额外的报价。您可以使用几种策略来解决此问题。
一个简单而常见的解决方法是，如果您的字符串包含双引号'，或者使用双引号"作为外部引号（如果您的字符串包含），则使用"作为外部引号'。
如果您的字符串包含两者，则可以使用转义字符或模板字符串。您可以在此处阅读有关字符串引用的更多信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String以及查看JavaScript支持的转义字符列表。
document.getElementById("topProducts").innerHTML = '<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>';<p id="topProducts" style="text-align: center;"></p>
答案 1 :(得分：2)
除了已经回答的匹配id值和正确转义引号之外还有一个问题。
段落元素不作为块元素的容器。如果您尝试将块元素放在“段落”中，则段落标记将自动关闭，因为末尾段落标记是可选的。
在所需的输出中
<p id="topProducts" style="text-align: center;"><div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div></p>
末尾的</p>标记是无效的HTML并被忽略。
答案 2 :(得分：1)
看起来您的ID不匹配（topProducts vs topBar1）。您还需要转义字符串或使用不同的单引号。更新了代码段：
document.getElementById("topProducts").innerHTML = '<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>';<p id="topProducts" style="text-align: center;"></p>
答案 3 :(得分：1)
您的ID与您在JavaScript代码中通过ID搜索元素的ID不匹配，并且当您为innerHTML分配值时，您不会在style=之后转义内部双引号
所以逃避那些内在的引用或使用＆＃39; （single quote）在innerHTML的赋值中
document.getElementById("topProducts").innerHTML = '<div style="float: right"><span class="glyphicon glyphicon-shopping-cart"></span><a href="../Cart.html">カアート</a>    </div>';