为什么 <script src=""> 不起作用？答案

【问题标题】：Why <script src=""> isn't working?为什么 <script src=""> 不起作用？
【发布时间】：2016-10-19 03:31:37
【问题描述】：

为什么我无法通过 src 方法访问脚本，但是当我将脚本放入我的 html 文件时一切正常？有任何想法吗？我做了很多事情，比如把这个脚本放在文件夹等中，但现在我把它放在和我的 html 网站一样的文件夹中，那么问题是什么？请帮帮我！

这是我的 .html 文件

<html lang="pl">
<head>
    <title> HTML/CSS: układ strony www w oparciu o elementy HTML5. </title>
    <meta charset="UTF-8">
<script src="data.js" type="text/javascript"></script>
    <link rel="stylesheet" href="style.css">
</head>

<body>

    <div id="strona">
        <header class="elementy">
         <img src="zdj/win95.png" alt="Win95" />
         <p>Najlepszy system operacyjny świata...</p>
         <div id="txt"></div>
        </header>

        <nav id="nav_gorny" class="elementy">
           <ol>
           <li class="home"><a href="index.html">Strona główna</a></li>
           <li class="system"><a href="system.html">O systemie</a></li>
           <li class="wymag"><a href="wymagania.html">Wymagania</a></li>
           <li class="galeria"><a href="galeria.html">Galeria</a></li>
           </ol>
        </nav>

        <nav id="nav_lewy" class="elementy">
        <ul>
            <li><a href="index.html">Strona główna</a></li>
            <li><a href="system.html">O systemie</a></li>
            <li><a href="wymagania.html">Wymagania systemu</a></li>
            <li><a href="galeria.html">Galeria zdjęć Windows95</a></li>
            <li><a href="programy.html">Programy</a></li>
            <li><a href="autor.html">Autor</a></li>
        </ul>
        </nav>


        <article>
            <section id="sekcja_gorna" class="elementy">
                <p> Wymagania sprzętowe </p>
            </section>
            <section id="sekcja_dolna" class="elementy">
                <p>
                <table style="width:100%">
                     <tr>
                        <th>Minimalne</th>
                        <th>Zalecane</th>
                     </tr>
                    <tr>
                        <td>Procesor Intel 80386DX 16 MHz</td>
                        <td>Procesor Intel 80486DX 16 MHz</td>
                    </tr>
                        <tr>
                        <td>4 MB pamięci RAM (8 MB przy OSR2 i późniejsze)  </td>
                        <td>8 MB pamięci RAM (16 MB przy OSR2 i późniejsze)</td>
                    </tr>
                        <tr>
                        <td>50-55 MB wolnego miejsca na dysku</td>
                        <td>50-55 MB wolnego miejsca na dysku</td>
                    </tr>
                    <tr>
                        <td>VGA (640x480), 16 kolorów</td>
                        <td>SVGA (800x600), 256 kolorów</td>
                    </tr>
                        <tr>
                        <td>Stacja dyskietek 3½" o wysokiej gęstości</td>
                        <td>Stacja dyskietek i napęd CD-ROM</td>
                    </tr>
                    </table>
                </p>                
            </section>
        </article>
</br>
        <aside class="elementy">
        <a href="#">
        <img src="zdj/auto.jpg">
        </a>
        <a href="#">
        <img src="zdj/poz.png">
        </a>
        </aside>
<br />
       <center> <footer class="elementy">
           <p> Copyright © Maciej Śliwiński 4F &nbsp;<a href="kontakt.html"> Kontakt &nbsp;</a> <a href="autor.html"> Autor </a></p>
        </footer></center> 
    </div>


</body>
</html>

这是我的 .js 文件

function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    var s = today.getSeconds();
    m = checkTime(m);
    s = checkTime(s);
    document.getElementById('txt').innerHTML =
    "Time: " + h + ":" + m + ":" + s;
    var t = setTimeout(startTime, 500);
}
function checkTime(i) {
    if (i < 10) {i = "0" + i};  
    return i;
}

【问题讨论】：

是否在同一个文件夹中。检查文件名
你没有关闭链接标签
并且也没有结束 div 标记...链接是 void 元素，因此不需要关闭，但在您提供的标记中没有 div 的结束标记
链接标签？具体在哪里？
尽管有许多 html 标签错误，但如果 data.js 与 html 文件位于同一文件夹中，它将加载 - 你怎么知道 data.js 没有加载？ data.js 中的两个函数都没有在 html 中调用，所以，你希望 data.js 做什么

标签： javascript html

【解决方案1】：

从您的代码来看，您似乎没有调用任何一个函数。如果您确定脚本没有加载，F12 工具会有所帮助，正如其他人在 cmets 中所建议的那样。

尝试调用 JavaScript 文件底部的 startTime() 函数，看看它是否有效：

function startTime() {
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var s = today.getSeconds();
  m = checkTime(m);
  s = checkTime(s);
  document.getElementById('txt').innerHTML =
  "Time: " + h + ":" + m + ":" + s;
  var t = setTimeout(startTime, 500);
}
function checkTime(i) {
  if (i < 10) {i = "0" + i};  
  return i;
}
startTime();

更新：下面评论中提到的错误是在页面上存在txt元素之前执行的脚本引起的。这里有两个解决方案：

将脚本移至页面底部。

<html>
  <head>
    ...
  </head>
  <body>
    ...
    <script src="data.js"></script>
  </body>
</html>

在页面加载之前不要执行脚本。有几种方法可以做到这一点。这是一个：

// Instead of this at the end of your script:
startTime();
// Do this:
window.addEventListener('load', startTime);

【讨论】：

无法设置属性“innerHTML”为空
好！这意味着您正在尝试在元素存在之前对其进行修改。这意味着脚本正在运行。您可以将移动到

【解决方案2】：

首先，确保您正确保存了您的 javascript 文件。其次，打开一个新页面，看看您是否可以从该路径访问您的 javascript 文件。第三，您是否正确保存了文件？我建议您打开一个新文件并使用 .js 扩展名正确保存您的代码。

示例目录结构。

ParentDirectory/ChildDirectory
../mytemplate.html
../myfunc.js
../othertemplates.html

上面的示例文件都在同一个目录中。类似地设置你的结构并测试它是否有效

【讨论】：

【解决方案3】：

您的 javascript 文件正在加载且没有错误。但是您没有在 JS 文件上调用该函数，因此它没有执行并且对 html 文件没有影响。请再次检查您的 JS 代码。

【讨论】：

它现在有错误：无法将属性“innerHTML”设置为空。我能做什么？

【解决方案4】：

这里有几个问题你的标记有很多错误没有正确的结束标签在表中你没有thead和tbody

<html>


<head>
<meta charset="UTF-8">
    <title> HTML/CSS: układ strony www w oparciu o elementy HTML5. </title>

    <script src="flexbox.js" type="text/javascript"></script>
    <link rel="stylesheet" href="flexbox.css">
</head>

<body>

    <div id="strona">
        <header class="elementy">
            <img src="zdj/win95.png" alt="Win95" />
            <p>Najlepszy system operacyjny świata...</p>
            <div id="txt"></div>
        </header>

        <nav id="nav_gorny" class="elementy">
            <ol>
                <li class="home"><a href="index.html">Strona główna</a></li>
                <li class="system"><a href="system.html">O systemie</a></li>
                <li class="wymag"><a href="wymagania.html">Wymagania</a></li>
                <li class="galeria"><a href="galeria.html">Galeria</a></li>
            </ol>
        </nav>

        <nav id="nav_lewy" class="elementy">
            <ul>
                <li><a href="index.html">Strona główna</a></li>
                <li><a href="system.html">O systemie</a></li>
                <li><a href="wymagania.html">Wymagania systemu</a></li>
                <li><a href="galeria.html">Galeria zdjęć Windows95</a></li>
                <li><a href="programy.html">Programy</a></li>
                <li><a href="autor.html">Autor</a></li>
            </ul>
        </nav>


        <article>
            <section id="sekcja_gorna" class="elementy">
                <p> Wymagania sprzętowe </p>
            </section>
            <section id="sekcja_dolna" class="elementy">

                <table>
                    <thead>
                        <thead>
                            <tr>
                                <th></th>
                                <th></th>

                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>Procesor Intel 80386DX 16 MHz</td>
                                <td>Procesor Intel 80486DX 16 MHz</td>
                            </tr>
                            <tr>
                                <td>4 MB pamięci RAM (8 MB przy OSR2 i późniejsze) </td>
                                <td>8 MB pamięci RAM (16 MB przy OSR2 i późniejsze)</td>
                            </tr>
                            <tr>
                                <td>50-55 MB wolnego miejsca na dysku</td>
                                <td>50-55 MB wolnego miejsca na dysku</td>
                            </tr>
                            <tr>
                                <td>VGA (640x480), 16 kolorów</td>
                                <td>SVGA (800x600), 256 kolorów</td>
                            </tr>
                            <tr>
                                <td>Stacja dyskietek 3½" o wysokiej gęstości</td>
                                <td>Stacja dyskietek i napęd CD-ROM</td>
                            </tr>
                        </tbody>
                </table>

            </section>
        </article>
        <br/>
        <aside class="elementy">
            <a href="#">
                <img src="zdj/auto.jpg">
            </a>
            <a href="#">
                <img src="zdj/poz.png">
            </a>
        </aside>
        <br />
        <center>
            <footer class="elementy">
                Copyright © Maciej Śliwiński 4F &nbsp;<a href="kontakt.html"> Kontakt &nbsp;</a> <a href="autor.html"> Autor </a>
            </footer>
        </center>
    </div>


</body>

</html>

这与脚本无关您在 html 标记中有 lang 属性，这是错误的 lang 属性进入元标记。这是标记的问题我已更正您的标记。请检查。希望这有帮助

【讨论】：

我刚刚添加了 dummy js 文件和 css 文件来测试...您可以考虑更改它们