首页 > 解决方案 > Html 和 js 文件 / OS X

问题描述

我是一个真正的编码新手,所以我的问题对你们来说是相当基本的。我正在练习一些关于 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>";

我猜可能是操作系统阻止了 .js 被执行?有没有办法让它工作?

谢谢

标签: javascripthtmlinnerhtml

解决方案


脚本标签应该在正文结束标签之前声明,这样它就可以访问在它之前加载的 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>


推荐阅读