HTML 代码块分配给 JavaScript 变量

创建于 2024-12-03 / 28
字体： [默认] [大] [更大]

主题:JavaScript / jQuery

答案:使用连接运算符(+)

使用连接运算符 (+) 将 HTML 代码块分配或存储在 JavaScript 变量中的最简单、最安全的方法。 您应该在标记 HTML 代码块时使用单引号，这样在实际的 HTML 代码中保留双引号会更容易。

您还需要转义出现在 HTML 块内容中的单引号 — 只需将 ' 字符替换为 \’ 即可，如下例所示:

示例

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>将 HTML 代码存储在 JavaScript 变量中</title> 
</head> 
<body>
<div id="wrapper"></div>
<script>
/* Storing HTML code block in a variable */
var codeBlock = '<div class="content">' +
                    '<h1>这是一个标题</h1>' +
                    '<p>这是一段文本</p>' +
                    '<p><strong>Note:</strong> If you don\’t escape "quotes" properly, it will not work.</p>' +
                '</div>';

/* Inserting the code block to wrapper element */
document.getElementById("wrapper").innerHTML = codeBlock
</script> 
</body>
</html>

FAQ 相关问题解答

以下是与此主题相关的更多常见问题解答:


0 人点赞过