html格式转换

作者：忽然之间发布日期:2026-05-11 浏览:125

<!DOCTYPE html>
<html>
<head>
    <title>HTML 格式转换示例</title>
</head>
<body>
    <h1>HTML 格式转换示例代码</h1>
    <p>以下是一个简单的 HTML 格式转换示例，将纯文本转换为 HTML 格式。</p>

    <h2>原始文本</h2>
    <pre>
标题：HTML格式转换
段落：这是一个关于HTML格式转换的示例。
列表：
- 项目1
- 项目2
- 项目3
    </pre>

    <h2>转换后的 HTML</h2>
    <div id="converted-html">
        <h1>HTML格式转换</h1>
        <p>这是一个关于HTML格式转换的示例。</p>
        <ul>
            <li>项目1</li>
            <li>项目2</li>
            <li>项目3</li>
        </ul>
    </div>

    <script>
        // 示例代码解释：这里使用 JavaScript 来动态生成 HTML 内容
        document.getElementById('converted-html').innerHTML = `
            <h1>HTML格式转换</h1>
            <p>这是一个关于HTML格式转换的示例。</p>
            <ul>
                <li>项目1</li>
                <li>项目2</li>
                <li>项目3</li>
            </ul>
        `;
    </script>
</body>
</html>

解释说明：

HTML 结构：页面包含一个标题、一段描述、原始文本和转换后的 HTML 内容。
<pre> 标签：用于展示原始文本，保持其格式不变。
<div id="converted-html">：用于展示转换后的 HTML 内容。
JavaScript 动态生成 HTML：通过 document.getElementById 和 innerHTML 方法，将原始文本转换为 HTML 格式并插入到页面中。

上一篇：html中—————这条横线

下一篇：html标记是什么