时间戳

首页 > 解决方案 > 使用 js 文件中的数组时出错

javascript - 使用 js 文件中的数组时出错

问题描述

我有这个 html 文件，我想在其中显示一个有序列表。该列表来自一个 js 文件中的数组，每次我使用“src”连接两个文档时，我都会收到一个错误，指出数组中的js 文件已被声明，但它们尚未声明。HTML 代码

<div id=fruit>
      <h3>Displaying Fruits</h3>

      <script src="js/list.js">

         var list = document.createElement('ol');
         fruits.forEach(function (element){
           var li = document.createElement('li');
           li.textContent = element;
           list.appendChild(li);
         });
         var fruit = document.querySelector('#fruit');
         fruit.appendChild(list);
      </script>
    </div>

JS代码

const fruits = ['Apples', 'Oranges', 'Pears', 'Grapes', 'Pineapples', 'Mangos'];

错误

未捕获的SyntaxError：标识符“fruits”已在 VM13 list.js:1 中声明

标签： javascripthtml

解决方案

看，任何具有src属性的脚本标签都会忽略脚本块内写入的所有内容。因此，您可能需要再添加一个脚本标签： 

<script src="js/list.js"></script>
<script>
  var list = document.createElement('ol');
  fruits.forEach(function(element) {
    var li = document.createElement('li');
    li.textContent = element;
    list.appendChild(li);
  });
  var fruit = document.querySelector('#fruit');
  fruit.appendChild(list);
</script>

推荐阅读