gpt4 book ai didi

javascript - 保持脚本元素独立

转载 作者:行者123 更新时间:2023-11-28 07:19:53 26 4
gpt4 key购买 nike

简短版本:如何保留不同<script>的内容元素相互独立吗?

长版本:我有一个 django 模板,看起来有点像这样:

<div class="app-container">
<script src="app.js"></script>
<script>
$(function() {
app_init($('.app-container')); // app_init is defined in app.ja
});
</script>
</div>

困难在于我希望能够在同一页面中多次包含此模板。当我这样做时,$('.app-container')选择器匹配所有 <div class="app-container">页面上的元素。

保持这些独立性的最佳方法是什么?我能想到一些选项,但不太明白如何使它们发挥作用:

  • 查找<div ...>标签是 <script> 的父标签标签。如果脚本是自动执行的,那么我可以使用 document.scripts[-1] 来查看它是如何工作的。但当代码在 $(function () { ... }) 中执行时,我无法发现如何执行此操作.
  • 分配 <div> 的类以编程方式标记,然后在 javascript 中以编程方式找出相同的类。但我不知道该怎么做。
  • 巧妙地使用匿名函数并捕获了这一点,但我还是不太明白。

编辑我看到人们提出了对此的各种变体:

<div class="app-container">
<script>
var thisscript = document.currentScript;
$(function() {
app_init($(thisscript).closest('.app-container'));
});
</script>
</div>

如果在页面中多次使用模板,则此方法不起作用,如 thisscript变量在它们之间是通用的,因此它始终是最后一个 div.app-container在被处理的页面中。

最佳答案

这是一种可能有效的技术。您必须弄清楚全局变量问题。

<!DOCTYPE html>
<html>

<head>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<script>
var thisScript = [];
</script>

<body>

<div class="app-container">
some text
<p>one</p>
<script src="app.js"></script>
<script>
thisScript.push(document.currentScript);
console.log(1);
$(function() {
//app_init($('.app-container')); // app_init is defined in app.js
});
</script>
</div>

<div class="app-container">
second instance
<p>two</p>
<script src="appy.js"></script>
<script>
thisScript.push(document.currentScript);
console.log(2);
$(function() {
//alert( script );
//app_init(script); // app_init is defined in app.js
});
</script>
</div>

<div class="app-container">
here is poor html
<p>last</p>
<script src="appy.js"></script>
<script>
thisScript.push(document.currentScript);
console.log(3);
$(function() {
/**/
});
</script>
</div>

<script>
console.log(thisScript);
</script>
</body>

</html>

此外,请参阅这篇文章以了解可能适合您的情况的更多选项:How may I reference the script tag that loaded the currently-executing script?

关于javascript - 保持脚本元素独立,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30430282/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com