Question

我需要输出一个包含html代码的Javascript变量的内容：

var jsVar = '<div>
<p> Sample text </p>
<img src="some image.jpg"  alt="" />
<div>';

我想使用innerHTML将其添加到页面上的对象中。我该怎么做？

Answer 1

var element = document.getElementById("myElementId");
element.innerHTML = jsVar;

这是假设您通过getElementById()获取元素;有许多方法可以在JavaScript中获取元素，比如getElementsByTagName()（返回一个元素数组）或者通过监听作为参数传递给它们的元素的事件。

此外，您将字符串加载到jsVar的方式目前无效。您需要将它全部放在一行上，或者连接多个字符串，如下所示：

// Method 1
var jsVar = '<div><p> Sample text </p><img src="some image.jpg"  alt="" /><div>';

// Method 2
var jsVar = '<div>' +
    '<p> Sample text </p>' +
    '<img src="some image.jpg"  alt="" />' +
    '<div>';

Answer 2

var element= document.getElementById("elementID");
element.innerHTML = someHTMLstring;

Answer 3

document.getElementById('id').innerHTML = jsVar;

Answer 4

另请注意，您必须使用\n代替JavaScript中的换行符：

var jsVar = '<div>\n<p> Sample text </p>\n<img src="some image.jpg"  alt="" />\n<div>';

如果您不这样做，您将收到“unterminated string literal”错误。

Answer 5

您指定的字符串不能跨越多行：

这不起作用

ttt = "ab
c";

这样做

ttt = "ab" +
      "c";

最好是逃避所有特殊字符，并删除字符串中的换行符（我不喜欢用'做的字符串'，尽管这是个人的事情:)。

var jsVar = "<div><p> Sample text </p> <img src=\"some image.jpg\"  alt=\"\" /><div>";

使用innerHTML输出

5 个答案: