如何在网页中嵌入代码段

首先看你是想嵌入外部代码段还是本地代码段。


嵌入外部代码段本质就是嵌入外部网页,参见
如何将一个HTML页面嵌套在另一个页面中 - Holy - 51CTO技术博客

嵌入外部代码段最简单的方式是使用js脚本,例如可以使用gist.github.com提供的js脚本。具体方法就将从gist获得的脚本代码插入到htm文件中即可。

嵌入外部代码段的优点在于当外部代码段修改时嵌入外部代码段的本地网页不必修改。另外,无需操心代码的字体,着色等格式问题(例如引用gist的代码段)。

嵌入外部代码段的缺点(尤其是以js脚本的方式嵌入)在于浏览器有可能会禁止js脚本,尤其是ie浏览器。不过这对于有经验的用户不是问题。另一个问题就是加载js脚本的速度根据脚本提供网站的不同也不一样,一些国外的网站加载就比较慢,如果遇到网站访问不了的情况,还会加载失败。另外还有可能存在递归加载js脚本的情况(这个只是我的推测)。


嵌入本地代码段就很简单了,直接在本地网页中粘贴代码段对应的htm源码。

嵌入本地代码段的优点在于加载迅速不卡顿,也不用担心js脚本的问题(因为使用的是纯HTML代码)。

嵌入本地代码段的缺点在于如果此代码段在多处被引用,则不能做到一改全改。另外,引用本地代码段还需操心代码的字体,着色等格式问题。不过这个问题可以间接方法解决掉,具体做法如下:

在gist URL(注意不是供嵌入的js脚本的URL,而是用浏览器直接访问代码段的URL)后附加.pibb并访问之,就可以得到一个可供嵌入的纯 HTML 的版本,然后将其源码粘贴到本地网页中即可。

此条目发表在 ., 语言与设计 分类目录。将固定链接加入收藏夹。

发表评论

电子邮件地址不会被公开。

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>