javascript – 如何在页面上动态地嵌入整个GitHub Gist?

我有一些文本,其中包含 GitHub Gists的URL.我想寻找这些URL,并将Gist内联在客户端内容中.我试过的一些事情

直接查询GitHub的OEmbed API.

对于https://gist.github.com/733951,这意味着我做了一个JSON-P查找
https://github.com/apI/Oembed?format=json\u0026amp;amp;url=https://gist.github.com/733951,
提取对象的html属性,并将其添加到我的页面.问题
这里是GitHub的OEmbed API只返回Gist的前三行.

使用jQuery-embedly plugin.

调用

jQuery('a.something').embedly({allowscripts: true})

作品,但Embedly从Gist格式.将其包含在< pre>标签没有帮助,因为没有换行符.

使用GitHub的.js版本的要点.

https://gist.github.com/733951.js使用document.write,所以当我动态地需要它时,我没有任何控制页面的位置. (如果我可以将其写入HTML源代码,它将显示在正确的位置,但这一切都在客户端完成.)

解决方法

我受到客户端重点嵌入的启发,并为此建立了一个script.js hack库(我也使用它来删除嵌入式链接风格,并使用我自己的风格,更适合我的页面)

它比通用嵌入图表和粘贴更通用 – 实际上我正在使用它来动态加载一些第三方小部件/谷歌地图/ Twitter的帖子)…

https://github.com/kares/script.js

这是嵌入示例:

https://github.com/kares/script.js/blob/master/examples/gistsAndPasties.html

更新:gist的API从此支持JSONP,jQuery示例:

var printGist = function(gist) {
    console.log(gist.repo,' (' + gist.description + ') :');
    console.log(gist.div);
};
$.ajax({ 
    url: 'https://gist.github.com/1641153.json',dataType: 'jsonp',success: printGist 
});

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...