V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
yearliny
V2EX  ›  问与答

如何在 HTML 网页中展示 HTML 源码

  •  
  •   yearliny · 2017-11-24 09:55:09 +08:00 · 1611 次点击
    这是一个创建于 2338 天前的主题,其中的信息可能已经有所发展或是发生改变。

    对 HTML、CSS、jQuery 处于一知半解的学习状态。往页面中插入 HTML 源码作为展示时,总是 载入 这个页面,包括源码中引入的 JS/CSS 都被执行了。

    $.post("/test", function(data){
    	$("#page-html").html('"'+data.body+'"');
    }, 'json');	
    

    网页有个简单的 jQuery 脚本,通过一个 Ajax 请求获得一个页面的 HTML 源码,并且把源码插入到 <pre id="page-html"></pre> 内,通过观察发现他人的网页插入源码显示时,源码都在 " 双引号的包括中,于是在展示时,给服务端返回的 HTML 源码前后分别加上了一个双引号。

    但是在实际使用过程中,依然时直接完全的载入了 HTML 网页,而不是作为源码显示,而加入的双引号显示时是在 HTML 页面中的开始位置加入了三个双引号。

    这是哪里出了问题呢?

    8 条回复    2017-11-24 10:50:50 +08:00
    TimePPT
        1
    TimePPT  
       2017-11-24 10:05:13 +08:00 via iPhone
    <code>
    zjqzxc
        2
    zjqzxc  
       2017-11-24 10:11:43 +08:00   ❤️ 1
    <script type='text/html' style='display:block'>
    <h1>hello world</h1>
    </script>
    falcon05
        3
    falcon05  
       2017-11-24 10:12:51 +08:00 via iPhone   ❤️ 1
    把<>替换成 html 编码
    sneezry
        4
    sneezry  
       2017-11-24 10:15:05 +08:00 via iPhone
    试试 innerText 呢
    wayket
        5
    wayket  
       2017-11-24 10:21:36 +08:00   ❤️ 1
    $("#page-html").text()
    yearliny
        6
    yearliny  
    OP
       2017-11-24 10:43:37 +08:00
    @wayket 太感谢了,问题解决了~ :)
    yearliny
        7
    yearliny  
    OP
       2017-11-24 10:49:08 +08:00
    @falcon05 这个方法可以解决问题,替换 HTML 编码的方式也能够以源码的方式显示,但是这种方式显示可读性不太好。
    yearliny
        8
    yearliny  
    OP
       2017-11-24 10:50:50 +08:00
    @zjqzxc 我使用你的源码也能正常显示<h1>标签,让我不解的是,当我把后端传入的 HTML 源码放入你给的<script>块时,依然是载入了网页。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3647 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 04:31 · PVG 12:31 · LAX 21:31 · JFK 00:31
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.