Элемент, не подлежащий повторению, если в отдельном файле javascript

#javascript

#javascript

Вопрос:

Привет, я пытаюсь изучить javascript из этих руководств: https://javascript.info/searching-elements-dom , но я застрял и не смог найти решение этой проблемы. Прошу прощения, если это повторяющийся вопрос, но я не смог найти решение с помощью Google, все ответы заключались в том, что скрипт должен быть внизу страницы, которая у меня есть. В принципе, это работает нормально:

 <html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" type="text/css" href="mystyle.css">
  <title>Javascript Learning</title>

</head>
<body>
<ul>
  <li>The</li>
  <li>test</li>
</ul>
<ul>
  <li>has</li>
  <li>passed</li>
</ul>
<script>
  let elements = document.querySelectorAll('ul > li:last-child');

  for (let elem of elements) {
    alert(elem.innerHTML); // "test", "passed"
  }
</script>
  

Но помещение javascript в отдельный файл, как у меня, приведет ко всем остальным урокам до сих пор. Оба файла .html и .js находятся в одной папке.

index.html:

 <html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" type="text/css" href="mystyle.css">
  <title>Javascript Learning</title>

</head>
<body>
<ul>
  <li>The</li>
  <li>test</li>
</ul>
<ul>
  <li>has</li>
  <li>passed</li>
</ul>
  
  <script src="main.js"></script>
</body>
</html>
  

main.js:

 let elements = document.querySelectorAll('ul > li:last-child');

for (let elem of elements) {
    alert(elem.innerHTML);
}
  

Браузер выдает мне эту ошибку:

Неперехваченная ошибка типа: элементы не подлежат повторению файл:///home/me/javascript/main.js:26 main.js:26:18

Я предположил, что, должно быть, где-то допустил ошибку, поэтому я вырезал и вставил прямо из руководства, чтобы убедиться, что я не допустил синтаксической ошибки, но все же это работает, если внутри html-файла, а не если он находится в отдельном файле javascript. Как это можно исправить, я уверен, что querySelectorAll — это именно то, что мне нужно для моего сайта, но я хочу, чтобы javascript в отдельном файле сохранял согласованность моего кода.

Комментарии:

1. В main.js , это единственный js, который у вас есть в этом файле, или есть еще что-то?

2. Я не могу воссоздать вашу ошибку. вы уверены, что этот код выдает ошибку?

3. Я только что скопировал код из своего сообщения обратно, и он работает. Я могу только предположить опечатку, и я думаю, что знаю, где это было, будучи человеком emacs, я подозреваю, что была точка с запятой, смешанная с таким «querySelectorAll;(…)» это был единственный способ, которым я мог воссоздать его, который подходит, я, к сожалению, переписал его правильно, поэтому не могу датьопределенное решение, но теперь оно работает, спасибо за ваш вклад.