欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  IT编程

HTML的(pre>标签中嵌套HTML标签时被解析的解决方案

程序员文章站 2022-08-04 11:51:37
1. 概述 标签中保留空格和换行，常用来展示代码片段，但如果直接嵌套HTML标签，会被浏览器解析，所以需要使用转义字符将代码片段转换为不被解析的文本。 2. 示例 我想显示以...

1. 概述

标签中保留空格和换行，常用来展示代码片段，但如果直接嵌套HTML标签，会被浏览器解析，所以需要使用转义字符将代码片段转换为不被解析的文本。

2. 示例

我想显示以下代码片段：

<html>
    <head>
        <meta charset="utf-8">
        <title>Wechat</title>
    </head>
    <body>
         <iframe src="https://wx.qq.com/"/>
     </body>
</html>

用<pre>包裹后：

<pre>
    <html>
        <head>
            <meta charset="utf-8">
            <title>Wechat</title>
        </head>
        <body>
             <iframe src="https://wx.qq.com/"/>
        </body>
    </html>
</pre>

那么浏览器将直接打开微信扫码登录页面，而这并不是我想要的效果。 

正确的操作是将整个文本转义（网上很多在线转义工具）后放入<pre>标签：

<pre>
    &lt;html&gt;
        &lt;head&gt;
            &lt;meta charset=&quot;utf-8&quot;&gt;
            &lt;title&gt;Wechat&lt;/title&gt;
        &lt;/head&gt;
        &lt;body&gt;
            &lt;iframe src=&quot;https://wx.qq.com/&quot;/&gt;
        &lt;/body&gt;
    &lt;/html&gt;
</pre>

上一篇： jquery的ajax跨域请求原理和示例

下一篇： 酥油是黄油吗，它们的差别是什么，有什么营养？

推荐阅读