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

2017-11-24 09:55:09 +08:00
 yearliny

对 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 页面中的开始位置加入了三个双引号。

这是哪里出了问题呢?

1613 次点击
所在节点    问与答
8 条回复
TimePPT
2017-11-24 10:05:13 +08:00
<code>
zjqzxc
2017-11-24 10:11:43 +08:00
<script type='text/html' style='display:block'>
<h1>hello world</h1>
</script>
falcon05
2017-11-24 10:12:51 +08:00
把<>替换成 html 编码
sneezry
2017-11-24 10:15:05 +08:00
试试 innerText 呢
wayket
2017-11-24 10:21:36 +08:00
$("#page-html").text()
yearliny
2017-11-24 10:43:37 +08:00
@wayket 太感谢了,问题解决了~ :)
yearliny
2017-11-24 10:49:08 +08:00
@falcon05 这个方法可以解决问题,替换 HTML 编码的方式也能够以源码的方式显示,但是这种方式显示可读性不太好。
yearliny
2017-11-24 10:50:50 +08:00
@zjqzxc 我使用你的源码也能正常显示<h1>标签,让我不解的是,当我把后端传入的 HTML 源码放入你给的<script>块时,依然是载入了网页。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/409111

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX