为什么我的外部javascript方法说它是未定义的

Why is my external javascript method saying it is undefined?

本文关键字：未定义 方法 我的 外部 javascript 为什么      更新时间：2023-09-26

我有一个外部方法，它将根据屏幕大小加载正确的CSS文件。当我添加更多的文件夹/页面时，我意识到我需要在调用它时指定文件夹的深度，这样它才能找到CSS文件。它适用于只有一行文本的一个文件夹深的页面，以确保它已加载。当我尝试加载包含图片和内容的索引页面时，它会加载除CSS文件"ReferenceError:Start is not defined"之外的所有内容。为什么它没有定义？请严格遵守javascript的所有解决方案，我不想在这个项目中使用jQuery。

这是头标签中的HTML

<script src="../Scripts/Load_CSS_Template.js"></script>
<script>Start(0);</script>

这是外部javascript

function Start(Folders_Deep)
{ 
    if (Folders_Deep == "undefined")
    {
        console.log("I was not defined");
    }
    else
    {
        var Prefix = "";
        if(Folders_Deep == 1)
        {
            Prefix = "../";
        } 
        console.log("Browser Screen Width: " + window.innerWidth);
        console.log("Hostname: " + window.location.hostname);
        console.log("Folders_Deep: " + Folders_Deep);
        console.log("Prefix: " + Prefix);
        if (window.innerWidth <= '1400')
        {
            Get_CSS_File(Prefix + 'Mobile_Template.css'); 
        }
        else 
        { 
            Get_CSS_File(Prefix + 'Desktop_Template.css'); 
        }
    }
}

如果CSS文件始终在根目录中，而JavaScript始终在目录/Scripts中，则不需要前缀，只需使用完整路径/Scripts/Load_CSS_Template.js、/Mobile_Template.css和/Desktop_Template.css即可。否则，请使用window.location查找您所在的位置并采取相应行动。

function Start(Folders_Deep) {
    var Prefix = "";
    if (undefined === Folders_Deep) {
        console.log("I was not defined");
    } else {
        if (Folders_Deep == 1) {
            Prefix = "../";
        } else if (Folders_Deep == 0) {
            Prefix = "./";
        }
        console.log("Browser Screen Width: " + window.innerWidth);
        console.log("Hostname: " + window.location.href);
        console.log("Folders_Deep: " + Folders_Deep);
        console.log("Prefix: " + Prefix);
        if (window.innerWidth <= '1400') {
            Get_CSS_File(Prefix + 'Mobile_Template.css');
        } else {
            Get_CSS_File(Prefix + 'Desktop_Template.css');
        }
    }
}

好的。试试这个。

将其添加到html文件中的<head>部分：

<script type="text/javascript">
function getScript(src, callback) {
  var s = document.createElement('script');
  s.src = src;
  s.async = true;
  s.onreadystatechange = s.onload = function() {
    if (!callback.done && (!s.readyState || /loaded|complete/.test(s.readyState))) {
      callback.done = true;
      callback();
    }
  };
  document.querySelector('head').appendChild(s);
}
function myCallback() { Start(0); }
getScript("../Scripts/Load_CSS_Template.js", myCallback);
</script>

它是../在调用中加载js文件。我忘了我是从文件夹里的页面上复制粘贴的。一旦我删除了它，它就加载了脚本。

如果你只想在加载文件时执行函数（不考虑其他文件和对象的加载），你可以简单地将Start（0）调用放在Load_CSS_Template.js 中函数的下面

即

function Start(Folders_Deep)
{ 
    if (Folders_Deep == "undefined")
    {
        console.log("I was not defined");
    }
    else
    {
        var Prefix = "";
        if(Folders_Deep == 1)
        {
            Prefix = "../";
        } 
        console.log("Browser Screen Width: " + window.innerWidth);
        console.log("Hostname: " + window.location.hostname);
        console.log("Folders_Deep: " + Folders_Deep);
        console.log("Prefix: " + Prefix);
        if (window.innerWidth <= '1400')
        {
            Get_CSS_File(Prefix + 'Mobile_Template.css'); 
        }
        else 
        { 
            Get_CSS_File(Prefix + 'Desktop_Template.css'); 
        }
    }
}
Start(0);

--------------------【替代方案】------------------------

相反，将Start(0)放在<body onLoad="">中，一旦加载完所有内容，就会执行它。（保持html <head>部分中的脚本加载原样。）

即

<body onLoad="Start(0)">Hello World</body>
相关文章：