在 codepen 中加载外部 .js (github) 库

Loading external .js (github) libraries in in codepen

来自 UX 设计师的新手问题已经尝试让这个工作 2 天了。

我正在尝试在 codepen 中测试 matthew dove 的注入脚本 https://github.com/Matthew-Dove/Inject

我已经使用 jsdelivr 将原始 github 文件复制到笔设置中。当我点击眼睛图标时,我可以看到 .js 文件。

我已将 Matthew 提供的示例代码复制到 html 面板中。

但是正如您在上图中所见,该网站并未被注入。 我的代码笔是 https://codepen.io/lisatw/pen/oNXxgMR

<html lang="en">
<head>
<meta charset="utf-8">
<meta content="initial-scale=1,width=device-width" name="viewport">
<title>Inject</title>
</head>
<body>
<h4>Below this heading the world's first website will be injected</h4>

<div data-inject-src="http://info.cern.ch/" style="height: 175px;"> </div>

<h4>Above this heading the world's first website will be injected</h4>


</body>
</html>

我试过调用和不调用 .js 库

<script src="./inject.js"></script>

非常感谢任何帮助。

当您通过 URL 在 CodePen 上添加脚本时,此 URL 将像之前 </body> 一样被注入。无需像这样显式添加脚本:

<script src="./inject.js"></script>

因为在那之后,CodePen 会自动添加另一个脚本:

<script src="https://cdn.jsdelivr.net/gh/Matthew-Dove/Inject@master/src/inject.js"></script>

但由于其他原因,该代码不起作用。这个问题甚至适用于 Matthew 的 https://rawgit.com/Matthew-Dove/Inject/master/src/example.html example, yahoo APIs (https://query.yahooapis.com/v1/public/yql) under the hood no longer available. https://twitter.com/ydn/status/1079785891558653952

很遗憾,您对此无能为力。