在 JavaScript 中写 HTML 代码的方法包括：使用 innerHTML 设置元素的 HTML 内容。使用 DOM API 创建和修改元素（createElement、appendChild）；使用 JavaScript 变量和函数创建动态 HTML 内容；修改现有内容（innerHTML、DOM API）；优化性能（缓存引用、用片段批量更新、避免频繁更新）。
如何在 JavaScript 中写 HTML 代码
简介
在 JavaScript 中写 HTML 代码可以实现动态创建和修改网页内容。这在创建交互式界面、加载远程数据以及更新部分页面时非常有用。
方法 1：使用 innerHTML
立即学习“前端免费学习笔记（深入）”；
innerHTML 可以设置元素的 HTML 内容。element.innerHTML = "<h1>标题</h1><p>内容</p>";
方法 2：使用 DOM API
createElement() 创建新元素。appendChild() 将新元素添加到父元素。<code class="js">const h1 = document.createElement("h1");
h1.textContent = "标题";
const p = document.createElement("p");
p.textContent = "内容";
const body = document.querySelector("body");
body.appendChild(h1);
body.appendChild(p);</code>创建动态内容
<code class="js">const name = "John";
const h1 = document.createElement("h1");
h1.textContent = `欢迎，${name}！`;</code>修改现有内容
innerHTML 或 DOM API 修改现有 HTML 元素的内容。<code class="js">const p = document.querySelector("p");
p.textContent = "更新的内容";</code>性能考虑
innerHTML 可能会导致性能问题。以上就是如何在js中写html代码的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
540
收藏
