首頁猿問 Javascript 在...

Javascript 在 <head> 中無法正確加載

JavaScript

holdtom 2022-12-22 12:42:47

代碼不工作，我似乎無法弄清楚為什么。我必須將 javascript 保留在 html 頭部，因為它是必需的，我相信那是我出錯的地方，它沒有正確加載。窗口加載對我來說是新事物，我不確定這是否是正確的方法用它 ___Javascript___ window.addEventListener("load", init); function validation(){ var userNme = document.getElementById("username").value; var pass = document.getElementById("password").value; var id = document.getElementById("student-id").value; var success = false; var words = /^[A-Za-z]+$/; if(userNme.match(words)){ document.getElementsByClassName("one").setAttribute("class", "hidden"); success = true; } else{ document.getElementsByClassName("one").setAttribute("class", "visible"); } if(pass.match(/[a-z]/) && pass.match(/[A-Z]/) && pass.match(/[0-9]/)){ document.getElementsByClassName("two").setAttribute("class", "hidden"); success = true; } else{ document.getElementsByClassName("two").setAttribute("class", "visible"); } if(id.length == 9){ document.getElementsByClassName("three").setAttribute("class", "hidden"); success = true; } else{ document.getElementsByClassName("three").setAttribute("class", "visible"); } } function init(){ var start = document.getElementById("go"); start.addEventListener("click", validation); } __HTML__ <input type="text" placeholder="Username" id="username" required> <div class="one hidden"> Username needs to contain only letters </div> <input type="password" id="password" placeholder="Password" required> <div class="two hidden" id="Pword"> Password needs to have at least one capital letter, one lower case, and one number </div>

查看完整描述

2 回答

慕村225694

TA貢獻1880條經驗獲得超4個贊

這是因為如果<script>在<head>. 當您希望 javascript 獨立于要掛載的元素執行時，您可以使用<script>in 。<head>

如果您的<script>標簽試圖修改中的對象DOM，您必須先等待該元素被掛載。

編輯：

修復 1：

<script>將標簽保留在這些元素下方。您還可以在另一個文件上使用所有這些 javascript，然后<script src="path/to/js">在腳本中使用的所有元素下方。

修復 2：

如果您想記住它，請使用loadeventListener on<body>然后執行所有這些代碼。而不是window.addEventListener("load", init);使用body.addEventListener("load", init).

反對回復 2022-12-22

躍然一笑

TA貢獻1826條經驗獲得超6個贊

Saurav Pathak 是正確的，內聯 JS 的預期格式應該是這樣的：

<head>

// Some standard JS in here

// For readability I would but the event listeners at the end

function validation(){

var userNme = document.getElementById("username").value;

var pass = document.getElementById("password").value;

var id = document.getElementById("student-id").value;

var success = false;

var words = /^[A-Za-z]+$/;

if(userNme.match(words)){

document.getElementsByClassName("one").setAttribute("class", "hidden");

success = true;

}

else{

document.getElementsByClassName("one").setAttribute("class", "visible");

}

if(pass.match(/[a-z]/) && pass.match(/[A-Z]/) && pass.match(/[0-9]/)){

document.getElementsByClassName("two").setAttribute("class", "hidden");

success = true;

}

else{

document.getElementsByClassName("two").setAttribute("class", "visible");

}

if(id.length == 9){

document.getElementsByClassName("three").setAttribute("class", "hidden");

success = true;

}

else{

document.getElementsByClassName("three").setAttribute("class", "visible");

}

function init(){

var start = document.getElementById("go");

start.addEventListener("click", validation);

}

window.addEventListener("load", init);

</script>

</head>

您也可以將所有 JS 放在一個單獨的文件中，加載方式如下： <script src='/path/to/app.js'></script>

最后要注意的是，有時您希望在使用 JS 獲取標簽之前呈現頁面的其余部分。很多時候你會把依賴于要呈現的 HTML 元素的 JS 放在 HTML 文件的底部（比如在<footer>標簽中）。

反對回復 2022-12-22

2 回答
0 關注
123 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

Javascript 在 <head> 中無法正確加載

Javascript 在 <head> 中無法正確加載

2 回答

添加回答