如何解决脚本文件外部的JS访问方法
这可能是一个愚蠢的问题,但我真的需要修复一个小滑块问题,因为它是自动播放的。
问题是,有没有办法从脚本文件本身之外访问已经实例化的对象?注意:也不知道它的变量/常量名称。
示例: 之前开发团队的某个人制作了一个 TNS / Tiny Slider 画廊,如下所示:
var someName = tns({
container: '.carousel',items: 3,autoplay: true,});
基本上它只是从该容器创建一个 tns 实例。在浏览器中,它显示了这样的内容
<div class="carousel tns-slider">
<div class="tns-item">...</div>
<div class="tns-item">...</div>
...
</div>
问题是,构建 someName tns 的代码来自外部 url,我不知道它在哪里。另外,我不知道“someName”变量的实际名称是什么,所以它已经在那里声明并正常工作,我只需要禁用自动播放。
我从 https://github.com/ganlanyuan/tiny-slider
的文档中尝试过但是,如果我知道实例化变量的名称(“someName”),它总是显示如何销毁()或停止()或播放(),而目前我无权访问该文件也不知道路径,我只是要求通过名为 updates-scripts.js 的新 JS 文件进行更新。这也在 codepen 和其他教程中进行了演示。
我有什么方法可以通过 jQuery('.carousel') 或 documentQuerySelector 访问它的方法吗?
谢谢
解决方法
这可以通过monkeypatching TNS来完成。在库加载之前为 window.tns
添加一个 setter。一旦库加载并分配给窗口,调用 setter,您就可以将一些 else 分配给拦截外部脚本的 window.tns
调用的窗口(您没有任何控制)使用。
然后只需访问传入对象的 .container
属性,并对其执行任何您需要的操作:
// Example code from the external script you have no control over
var slider = tns({
container: '.my-slider',items: 3,slideBy: 'page',autoplay: true
});
<script>
// Insert your monkeypatching script here,before anything else
Object.defineProperty(window,'tns',{
set(tns) {
// Delete this setter
delete window.tns;
window.tns = function(...args) {
const container = args[0]?.container;
console.log('container:',container);
return tns.apply(this,args);
};
},configurable: true
});
</script>
<script src="https://cdn.jsdelivr.net/npm/tiny-slider@2.9.3/dist/tiny-slider.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.3/tiny-slider.css">
<div class="my-slider">
<div>foo</div>
<div>bar</div>
<div>baz</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。