【问题标题】:My HTML code not picking up local javascript file我的 HTML 代码没有获取本地 javascript 文件
【发布时间】:2022-01-10 16:44:07
【问题描述】:

我正在学习一个使用 js 文件使静态页面动态化的教程,我逐字输入了所有内容,但是当我用浏览器打开它时,我的页面保持静态。 我在同一个目录下有 HTML 文件和 js 文件。

JS 和 HTML 文件

//some great message options
const vibes = [
    "... and you are awesome!",
    "... have an amazing day!",
    "... love to see you win!",
    "... can't wait to see what you accomplish today!",
    "... You got this!"
];

var vibe = vibes[Math.floor(Math.random() * Math.floor(vibes.length))];

// diplay a good vibe
document.querySelector(".vibe").append(vibe);
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>A page for you</title>
    <style>
        body{
            text-align:center;
        }
        div.container{
            width: 400px;
            margin: 0 auto;
        }
        .love{
            font-size: 4em;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>This is a page for you</h1>
        </div class="vibe">You are great!</div>
        <div class="love">
            ❤️
        </div>
    </div>
    <script type="text/javascript" src="vibe.js"></script>
</body>
</html>

如何获取 html 文件来选择 js 脚本并随机化消息?

【问题讨论】:

  • 您的浏览器开发者工具调试控制台有错误吗?这始终是要寻找的第一件事

标签: javascript html dynamic jamstack


【解决方案1】:

解决这个问题;

 </div class="vibe">You are great!</div>

应该是

<div class="vibe">You are great!</div>

【讨论】:

  • 谢谢,解决了。我想我需要退后一步来看看它。你知道有哪些编辑器会突出显示格式错误的 html 语法吗?
  • 很高兴它按预期工作:) 您可以使用validator.w3.org/#validate_by_input
  • @padawan 如果对您有帮助,请将其标记为“答案”:)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2020-03-14
  • 2018-01-05
  • 1970-01-01
  • 1970-01-01
  • 2015-12-31
  • 1970-01-01
  • 2011-09-16
相关资源
最近更新 更多