根据父 div id 加载 Javascript 文件

Question

--- 根据人们所说的 ---

这是一个多页面表单，它在 DOM 中加载多个页面。 DOM 加载 page_2_2 和 page_3_3 但是，一个具有 display:none 的样式属性，另一个没有。脚本是否可以通过检查哪个具有 display:none 的方式完成，然后加载适当的 Javascript 文件？比如：

如果 DIV ID=page_2_2 的 style="display:none"，则加载 page2.js，否则加载 page1.js？

---

我有两个 Javascript 文件...名为 page1.js 和 page2.js。

我需要一个基于 Javascript 的 if 函数

如果父DIV ID = page_2_2，则加载page1.js，如果父DIV ID = page_3_3，则加载page2.js，否则不加载。

Answer 1

function loadscript(divID) {
    var scriptURL;
    if (divID == "page_2_2")
       scriptURL = "page1.js";
    else if (divID == "page_3_3")
       scriptURL = "page2.js";
    $.getScript(scriptURL);
}

并不复杂，函数获取字符串作为参数。

loadscript("page_2_2") // will load page1.js
loadscript("page_3_3") // will load page2.js

作为字符串参数传递的 elementid 类型并不重要。

---

编辑：

据我了解，您有两个 div，其中一个具有“none”作为显示值，因此您可以这样做。

<div id="page_2_2" style="display:none"></div>
<div id="page_3_3"></div>

$(document).ready(function() {
    if ($('#page_2_2').is(':visible'))
        $.getScript("page1.js");
    else 
        $.getScript("page2.js");
});

Answer 2

只需运行检查然后加载

if($('#page_2_2').is(":visible")){
    $.getScript("/page1.js", function(data, textStatus, jqxhr) {
       console.log(data); //data returned
       console.log(textStatus); //success
       console.log(jqxhr.status); //200
       console.log('Load was performed.');
    });
}else if($('#page_3_3').is(":visible")){
    $.getScript("/page2.js", function(data, textStatus, jqxhr) {
       console.log(data); //data returned
       console.log(textStatus); //success
       console.log(jqxhr.status); //200
       console.log('Load was performed.');
    });
}

WORKING DEMO

Answer 3

您可以检查 div id，然后将脚本节点注入到标题中。自己没有测试过。

    if($('#[insert id]').length != 1){ inject script etc }

Answer 4

我建议使用基于特征的方法，根据将逻辑用于什么而不是将逻辑放在不同的文件中你用它。

示例文件结构：

/Scripts/Utils.js
/Scripts/SpecificEditor.js
/Scripts/Wysiwyg.js

在需要所见即所得的页面上，您将引用 Wysiwyg.js，在需要“SpecificEditor”的页面上，您将引用“SpecficEditor.js”。

采用您的方法，您的网站在发展壮大时将难以管理。例如，您如何在页面之间共享逻辑？

Answer 5

这应该可以解决问题：

function loadScript(filename){
 var fileref=document.createElement('script')
 fileref.setAttribute("type","text/javascript")
 fileref.setAttribute("src", filename)
 document.getElementsByTagName("head")[0].appendChild(fileref)
}

if(document.getElementById("page_2_2")===null){
 loadScript("page1.js");
}else if(document.getElementById("page_3_3")===null){
 loadScript("page2.js");
}

使用 jQuery 会稍微短一些，将 if-else-if 块转换为：

 if($(".page_2_2").length==0){
     loadScript("page1.js");
    }else if($(".page_3_3").length==0){
     loadScript("page2.js");
    }

您不清楚“父” div 的含义。在这种情况下，如果该页面上的 any div 具有该 ID，这将加载脚本。你不应该有多个具有相同 id 的元素，所以我想这没关系。否则 jQuery closest() 方法将起作用。