寫(xiě)在前面
1、基于2022級(jí)計(jì)算機(jī)大類(lèi)實(shí)驗(yàn)指導(dǎo)書(shū)
2、代碼僅提供參考，前端變化比較大，按照要求，只能做到像，不能做到一模一樣
3、圖片和文字僅為示例，需要自行替換
4、如果代碼不滿(mǎn)足你的要求，請(qǐng)尋求其他的途徑
運(yùn)行環(huán)境
window11家庭版
WebStorm 2023.2.2
實(shí)驗(yàn)要求、源代碼和運(yùn)行結(jié)果
1、采用HBuilder 編寫(xiě)代碼，實(shí)現(xiàn)圖6-1所示的效果，要求：
① 分別采用內(nèi)嵌式和外部引入式實(shí)現(xiàn)提示信息的顯示。
? 圖6-1提示信息顯示示意圖
(1)內(nèi)嵌方式引入JavaScript的格式為：
?? <script>
??????? javascript代碼
?? </script>
?? 其中<script>標(biāo)簽可位于<head>或<body>之間。
（2）外部引入式引入JavaScript的格式為：
??? <head>
??????? <script src= "javascript文件的路徑"></script>
??? </head>
??? 其中，JavaScript文件是以.js結(jié)尾的文件，文件中只寫(xiě)javascript代碼即可，不需要<script>標(biāo)記。
（3）彈出信息的內(nèi)部函數(shù)為：alert("彈出的提示信息");。
（4） 網(wǎng)頁(yè)中直接打印信息的內(nèi)部函數(shù)為：document.write("彈出的提示信息");。
Experiment6_1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="Experiment6_1.js"></script>
<!-- <script>-->
<!-- function showPrompt() {-->
<!-- alert("Hello World!");-->
<!-- }-->
<!-- function showPromptInline() {-->
<!-- document.write("Hello World!");-->
<!-- }-->
<!-- </script>-->
<title></title>
</head>
<body>
<script>
showPrompt();
showPromptInline();
</script>
</body>
</html>Experiment6_1.js
function showPrompt() {
alert("Hello World!");
}
function showPromptInline() {
document.write("Hello World!");
}
2、采用HBuilder 編寫(xiě)代碼，實(shí)現(xiàn)圖6-2所示效果，要求：
① JavaScript采用內(nèi)嵌引入方式，即在<head>標(biāo)簽之間通過(guò)<script>標(biāo)簽引入。
② 接收用戶(hù)輸入的姓名信息，姓名默認(rèn)值為空字符串。
③ 若姓名信息為空字符串、null、undefined，提示用戶(hù)輸入姓名；否則顯示歡迎信息。
圖6-2a 接收用戶(hù)輸入示意圖
圖11-2b 提示用戶(hù)輸入姓名示意圖
圖6-2c 用戶(hù)歡迎示意圖
（1）新建html文檔，在<head>之間采用<script>將JavaScript引入到網(wǎng)頁(yè)。
（2）采用var name = prompt(string1,string2)函數(shù)接收用戶(hù)輸入信息，其中，string1為提示信息，string2為輸入的默認(rèn)值。
（3）判斷用戶(hù)輸入格式：
if(name== " "||name==undefined ||name==null){ 請(qǐng)用戶(hù)輸入姓名提示信息 }
else{ 歡迎信息 }
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
function welcome() {
var name = prompt("請(qǐng)輸入您的姓名：", "");
if (name === "" || name === null || name === undefined) {
alert("請(qǐng)輸入您的姓名！");
} else {
alert("歡迎，" + name + "！");
}
}
</script>
<title></title>
</head>
<body>
<script>
welcome();
</script>
</body>
</html>輸入姓名前
輸入空，點(diǎn)擊確定
輸入姓名，點(diǎn)擊確定
3、采用HBuilder 編寫(xiě)九九乘法表函數(shù)，實(shí)現(xiàn)圖6-3所示的動(dòng)態(tài)展示效果，要求：
① JavaScript采用內(nèi)嵌引入方式，即在<head>標(biāo)簽之間通過(guò)<script>標(biāo)簽引入。
② 采用prompt()方法接收用戶(hù)輸入的九九表行數(shù)信息。
③ 編寫(xiě)九九乘法表動(dòng)態(tài)展示函數(shù)。
④ 判斷行數(shù)信息數(shù)值，在1-9范圍內(nèi)動(dòng)態(tài)顯示九九表，否則給出提示信息。
圖6-3a 用戶(hù)輸入九九乘法表行數(shù)信息操作示意圖
圖6-3b 行數(shù)為9時(shí)乘法表示意圖
圖6-3c 行數(shù)為5時(shí)乘法表示意圖
圖6-3d 行數(shù)在1-9范圍外時(shí)提示信息示意圖
（1）新建html文檔，在<head>標(biāo)簽之間通過(guò)<script>標(biāo)簽引入javascript代碼。
（2）編寫(xiě)九九乘法表動(dòng)態(tài)函數(shù)，函數(shù)參數(shù)為乘法表的行數(shù)。即：
?? function plusTable(rowCount)
{
?? //判斷rowCount范圍代碼，符合范圍執(zhí)行打印九九乘法表代碼，否則退出方法。
? ? ……? //輸出九九乘法表代碼程序
}
（3）采用var rowCount = prompt(string1,string2)方法接收乘法表行數(shù)信息，其中，string1為提示信息，string2為輸入的默認(rèn)值，此例中默認(rèn)值取9。
（4）判斷行數(shù)信息的范圍，在1-9范圍內(nèi)打印乘法表；否則給出錯(cuò)誤提示信息。
（5）doucment.write()輸出換行的方法為：document.write("<br /> ");。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
function generateMultiplicationTable(rowCount) {
if (rowCount >= 1 && rowCount <= 9) {
document.write("<table>");
for (let i = 1; i <= rowCount; i++) {
document.write("<tr>");
for (let j = 1; j <= i; j++) {
document.write("<td>" + j + " * " + i + " = " + (j * i) + "</td>");
}
document.write("</tr>");
}
document.write("</table>");
} else {
document.write("<p>請(qǐng)輸入1-9范圍內(nèi)的正整數(shù)</p>");
}
}
var rowCount = prompt("請(qǐng)輸入乘法表的行數(shù):", "9");
rowCount = parseInt(rowCount);
</script>
<title></title>
</head>
<body>
<script>
generateMultiplicationTable(rowCount)
</script>
</body>
</html>輸入數(shù)據(jù)前
輸入不符要求的數(shù)據(jù)，點(diǎn)擊確定
輸入符合要求的數(shù)據(jù)，點(diǎn)擊確定文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-759211.html
文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-759211.html
到了這里，關(guān)于成都工業(yè)學(xué)院Web技術(shù)基礎(chǔ)（WEB）實(shí)驗(yàn)六：ECMAScript基礎(chǔ)語(yǔ)法的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
