Html 和 js 文件 / OS X

Question

我是一个真正的编码新手，所以我的问题对你们来说是相当基础的。我正在练习 html/css/js 上的一些教程。我想我理解使用链接到 .html 页面的 .js 文件修改页面的 html 的概念。我在 codepen 中试过，效果很好。

然而，当我尝试从位于我桌面上的 html 文件在浏览器中启动我的 html 文件时，嗯，我的 html 页面没有被修改。我的 html 文件和 js 文件都在桌面上，所以路径相同。

下面我使用的代码：

<!DOCTYPE html>
<html lang="fr">
<head>
    <title>Mon titre on sen fout</title>
    <link rel="stylesheet" href="style.css" />
    <script type="text/javascript" src="test.js"></script> 
</head>
<body> 
  <h1> Title </h1>
<p> This is a text to be replaced </p>
</body>

以及 test.js 文件的内容：

let text = document.querySelector("p");
text.innerHTML = "<p>New Text</p>";

我猜也许 OS 阻止了 .js 的执行？有没有办法让它发挥作用？

谢谢

Answer 1

Script 标签应该在 body 结束标签之前声明，这样它就可以访问在它之前加载的 HTML 个元素。

let text = document.querySelector("p");
text.innerHTML = "New Text";

<!DOCTYPE html>
<html lang="fr">

<head>
  <title>Mon titre on sen fout</title>
  <link rel="stylesheet" href="style.css" />
  <style>
  body{
  background: #121212;
  color: white;
  }
  </style>
</head>

<body>
  <h1> Title </h1>
  <p> This is a text to be replaced </p>
  <script type="text/javascript" src="test.js"></script>
</body>

Html 和 js 文件 / OS X

Html and js file / OS X

html

javascript

innerhtml