Question

我在尝试让我的JS文件与我的HTML文件一起工作时遇到了一些麻烦，或者至少我认为这是问题所在。当我运行我的网站时，单击按钮时它不会将文本更改为新文本...

这是Js文件：

    var page = document.getElementById('pageContainer');

    function homepage() {
    page.innerHTML = '<p>This is the main page of the site!</p>';   
    }

   function contactpage() {
   page.innerHTML = '<p>This is the contact page of the site!</p>'; 
   }

   function aboutpage() {
   page.innerHTML = '<p>This is the about page of the site!</p>';   
   }

这是HTML文件：

    <html>
    <head>
        <script src="script.js" type="text/javascript" ></script>
        <link rel="stylesheet" href="style.css">
        <title>alphaEncryption's Website!</title>
    </head>
    <body>
        <h1>Welcome to the website!</h1>
        <h2>have a look around!</h2>
        <button id='home' onclick='homepage()'>Home</button>
        <button id='contact' onclick='contactpage()'>Contact</button>
        <button id='about' onclick='aboutpage()'>About</button>
        <div id='pageContainer'>
          <p id='page'>This is the main page of the site!</p>
        </div>
    </body>
    </html>

How it is now!

Answer 1

看起来您的Javascript将在加载html之前运行。尝试在关闭正文标记之前添加脚本标记。

将HTML文件附加到JS文件

1 个答案: