如何解决将外部JavaScript库加载到您的代码中并修改库的某些部分?
我正在尝试将外部JavaScript库加载到我的代码中:
var s = document.createElement(“ script”);
s.type =“ text / javascript”; s.src =“ http://vcg.isti.cnr.it/3dhop/distribution/js/presenter.js”; $(useTab).append(s);
我知道在库presenter.js"
中,我需要将某些const
变量更改为var
。我通过在服务器上下载presenter.js"
的本地副本并进行更改来进行检查。但是,我需要从互联网上加载该库。问题是,我可以修改外部JavaScript库并使程序正常工作吗?
我在StackOverflow的其他地方读到了可以尝试Ajax的内容:
$。ajax({ 方法:“ GET”, dataType:“文本”, 网址:“ http://vcg.isti.cnr.it/3dhop/distribution/js/presenter.js” })。then(function(data){data = data.replace('const SGL_TRACKBALL_NO_ACTION = 0;','var SGL_TRACKBALL_NO_ACTION = 0;') data = data.replace('const SGL_TRACKBALL_ROTATE = 1;','var SGL_TRACKBALL_ROTATE = 1;')data = data.replace('const SGL_TRACKBALL_PAN = 2;','var SGL_TRACKBALL_PAN = 2;')data = data.replace('const SGL_TRACKBALL_DOLLY = 3;','var SGL_TRACKBALL_DOLLY = 3;')data = data.replace('const SGL_TRACKBALL_SCALE = 4;','var SGL_TRACKBALL_SCALE = 4;')eval(数据) })
但是我没有运气。我是JavaScript新手,因此将不胜感激。我不确定我要问的内容是否可行。预先谢谢你!
编辑:
大家好,谢谢您的回复!好的,我尝试了以下操作:
var scripts = ["spidergl.js","presenter.js","nexus.js","ply.js","trackball_sphere.js","trackball_turntable.js","trackball_turntable_pan.js","trackball_pantilt.js","init.js"];
for (index = 0; index < scripts.length; index++) {
scripts[index] = "http://vcg.isti.cnr.it/3dhop/distribution/js/" + scripts[index];
}
getScripts(scripts,function () {
$(document).ready(function () {
init3dhop();
setup3dhop(referenceUrl,fileType);
resizeCanvas(640,480);
moveMeasurementbox(70,243);
movePickpointbox(70,301);
//moveToolbar(20,20);
});
});
这是实用程序功能getScripts
:
function getScripts(scripts,callback) {
var progress = 0;
scripts.forEach(function (script) {
$.getScript(script,function () {
if (++progress == scripts.length) callback();
});
});
}
到目前为止还算不错,但是当我运行破土机时出现错误:
Uncaught ReferenceError: SpiderGL is not defined
与presenter.js
相关(我认为与使用const
而不是var
有关)。但是,如果我刷新浏览器几次,则最终可以正常工作!!当它工作时,控制台中不会显示任何错误!
所以,我试图了解为什么会这样。再次感谢您的所有帮助!
解决方法
仅当端点没有CORS限制时,才可以使用ajax方法。大多数服务器确实有这样的限制,所以ajax通常不起作用。
如果您可以找到一个没有此类限制的托管库的地方,则可以使用ajax-例如,jsdelivr会允许它:
fetch('https://cdn.jsdelivr.net/npm/@snakesilk/react-presenter@0.2.0/dist/index.min.js')
.then(res => res.text())
.then(console.log);
给出源代码,然后可以在客户端对其进行修改,最后将修改后的代码作为<script>
标签附加。
但这真的很奇怪。分支该库,进行所需的修改并将修改后的脚本托管在您控制的服务器上会更加有意义。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。