国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

  1. Toy模板網(wǎng)首頁
  2. >Toy博客

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁

2年前作者：貓佛分類：Toy博客閱讀(101)違法舉報(bào)

這篇具有很好參考價(jià)值的文章主要介紹了[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁。希望對大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方，請大家不吝賜教，您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問。

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

希望你開心，希望你健康，希望你幸福，希望你點(diǎn)贊！

最后的最后，關(guān)注喵，關(guān)注喵，關(guān)注喵，佬佬會看到更多有趣的博客哦！??！

喵喵喵，你對我真的很重要！

目錄

前言

JavaScript程序

代碼

消息對話框

消息對話框-告警框

消息對話框-確認(rèn)框

消息對話框-提示框

JavaScript注釋

標(biāo)識符和變量

命名規(guī)范

1.標(biāo)識符

2.關(guān)鍵字

3.保留字

課后練習(xí)

網(wǎng)頁標(biāo)題：HTML屬性的事件處理器的應(yīng)用

網(wǎng)頁標(biāo)題：調(diào)用外部js文件的JavaScript函數(shù)

網(wǎng)頁標(biāo)題：給特定對象指定特定事件處理程序

總結(jié)

前言

Web 前端開發(fā)工程師應(yīng)掌握以下內(nèi)容

理解 JavaScript 程序的概念與作用；
掌握 JavaScript 標(biāo)識符和變量的概念及使用方法；
掌握 JavaScript 常用運(yùn)算符和表達(dá)式概念；
掌握 JavaScript 中順序、分支、循環(huán)等 3 種程序控制結(jié)構(gòu)語法；
掌握 JavaScript 函數(shù)的定義方法，并學(xué)會使用；
學(xué)會綜合運(yùn)用 JavaScript 設(shè)計(jì)具有動(dòng)態(tài)、交互功能的網(wǎng)頁。

JavaScript程序

???????? JavaScript程序由語句、語句塊、函數(shù)、對象、方法、屬性等構(gòu)成，通過順序、分支和循環(huán)三種基本程序控制結(jié)構(gòu)來進(jìn)行編程。

?語句和語句塊

JavaScript 語句是發(fā)送給瀏覽器的命令，這些命令的作用是告訴瀏覽器要做的事情。

???????? alert(“這是告警消息框!”); //彈出告警消息框

JavaScript 語句可以分批組合起來形成語句塊，語句塊以左花括號“ { ” 開始，以右花括號“ } ” 束。

?????????? {var s=0;document.write(“S的值=”+s);}?? //賦值，并輸出到頁面

代碼

JavaScript代碼是由若干條語句或語句塊構(gòu)成的執(zhí)行體。

<script type="text/javascript">
    var color="red";
    if(color=="red")
    {
      document.write("顏色是紅色!");  
      alert("顏色是紅色!");
    }
</script>

消息對話框

JavaScript中的消息對話框分為告警框、確認(rèn)框和提示框。

1.警告框

???? alert (message) ;

2.確認(rèn)框

????? var yn=confirm (message);

3.提示框

???? var s1=prompt (text, defaultText);

消息對話框-告警框

<!-- edu_14_2_1.html -->
<html>
<head>
<title>告警消息框使用實(shí)例</title>
</head>
<body>
<script type="text/javascript">
           alert("這是告警消息框！");
</script>
</body>
</html>

注：確定按鈕必須響應(yīng)，否則屏蔽一切操作。告警信息為純文本信息或字符串，不能含有HTML標(biāo)記。

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

消息對話框-確認(rèn)框

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

<!-- edu_14_2_2.html -->
<html>
<head>
<title>確認(rèn)框使用實(shí)例</title>
<script type="text/javascript">
function show_confirm() {
var r=confirm("請選擇按鈕!");
if (r==true)
{alert("您按了確定按鈕！");}
else{alert("您按了取消按鈕！"); }
}
</script>
</head>
<body>
<input type="button" onclick="show_confirm()" value="顯示確認(rèn)框" />
</body>
</html>

注：確認(rèn)按鈕的返回值，類型為邏輯值，確定true，取消false。

消息對話框-提示框

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

<!-- edu_14_2_3.html -->
<html>
<head>
<title>提示框使用實(shí)例</title>
<script type="text/javascript">
function disp_prompt() {
   var name=prompt("請輸入您的姓名","李大為");
   if (name!=null && name!="") {
   document.write("您好，" + name + "!"); }
}
</script>
</head>
<body>
<input type="button" onclick="disp_prompt()" value="單擊顯示提示框" />
</body>
</html>

注：選擇“確定”返回輸入的值，選擇“取消”返回null。

JavaScript注釋

JavaScript注釋：單行注釋和多行注釋。

單行注釋：使用“ //” 作為注釋標(biāo)記，可以單獨(dú)一行或跟在代碼末尾，放在同一行中，“ //” 后為注釋內(nèi)容部分。
多行注釋：以“ /*” 標(biāo)記開始，以“* /” 標(biāo)記結(jié)束，兩個(gè)標(biāo)記之間所有的內(nèi)容都是注釋文本。
使用注釋防止代碼執(zhí)行 -- 屏蔽某些語句行的執(zhí)行。? 
<!-- edu_14_2_4.html -->
<script type="text/javascript">
  //這是單行注釋
  /*這是多行注釋
      可以包含多行內(nèi)容
   */
   //alert("此語句不執(zhí)行！");
alert(“此語句執(zhí)行了！”);//執(zhí)行時(shí)彈出告警消息框
</script>

標(biāo)識符和變量

在任何一種編程語言中，實(shí)際編程時(shí)都要使用變量以存儲常用的數(shù)據(jù)。所謂變量，顧名思義，就是在運(yùn)行期間其值可以通過程序改變的量。

為了便于變量的使用，實(shí)際使用時(shí)需要給變量加以命名，變量的名字則稱為標(biāo)識符。

命名規(guī)范

1.標(biāo)識符

?????? 標(biāo)識符是計(jì)算機(jī)語言中用來表示變量名、函數(shù)名等的有效字符序列，簡單來說，標(biāo)識符就是一個(gè)名字，JavaScript關(guān)于標(biāo)識符的規(guī)定如下：

(1)必須使用字母或者下劃線和$開始。

(2)必須使用英文字母、數(shù)字、下劃線組成，不能出現(xiàn)空格或制表符。

(3)不能使用JavaScript關(guān)鍵字與JavaScript保留字。

(4)不能使用JavaScript語言內(nèi)部的單詞，比如Infinity，NaN，undefined等。

(5)大小寫敏感，如name和Name是不同的兩個(gè)標(biāo)識符。

2.關(guān)鍵字

?????? 關(guān)鍵字是JavaScript中已經(jīng)被賦予特定意義的一些單詞，關(guān)鍵字不能作為標(biāo)識符來使用。

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

3.保留字

?????? JavaScript中除了關(guān)鍵字以外，還有一些用于未來擴(kuò)展時(shí)使用的保留字，保留字同樣不能用于標(biāo)識符的定義。

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

課后練習(xí)

設(shè)計(jì)并實(shí)現(xiàn)如下圖所示的網(wǎng)頁功能，當(dāng)單擊“生成20個(gè)4位整數(shù)”按鈕時(shí)，在文本域中輸出20個(gè)4位隨機(jī)整數(shù)，并對其進(jìn)行排序；單擊“找出能被5整除的整數(shù)”按鈕時(shí)，在文本域中輸出相應(yīng)的結(jié)果；單擊“重置”按鈕可實(shí)現(xiàn)清除文本域中的所有內(nèi)容。

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3 ?[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

???????? 操作提示：

（1）文本域的html標(biāo)簽為textarea,例如：

<textarea id="display" rows="10" cols="50"></textarea>

創(chuàng)建一個(gè)10行50列的文本域，文本域中值的獲取方式與text文本框相同，可使用id名.value的方式，例如：display.value.

（2）可定義一個(gè)數(shù)組來存放生成的20個(gè)隨機(jī)整數(shù)，再通過對數(shù)組元素的操作實(shí)現(xiàn)題目中要求的相應(yīng)功能。

???????? （3）生成一個(gè)4位隨機(jī)整數(shù)的代碼為：Math.floor(Math.random() * 9000 + 1000); 其中Math.random()函數(shù)隨機(jī)生成0-1之間的數(shù)，Math.floor(x)返回小于參數(shù)x的最大整數(shù),即對浮點(diǎn)數(shù)向下取整。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>隨機(jī)產(chǎn)生20個(gè)4位整數(shù)并從小到大進(jìn)行排序</title>
		<script type="text/javascript">
			var numlist = new Array(); //定義存放整數(shù)的數(shù)組
			function createNum() {
				for (var i = 0; i < 20; i++) {
					numlist[i] = Math.floor(Math.random() * 9000 + 1000);
				}
				numlist.sort();
				//(n.sort()).reverse(); sort()默認(rèn)升序排序，reverse()將數(shù)組逆序，可簡單實(shí)現(xiàn)降序排列。
				display.value = "隨機(jī)產(chǎn)生20個(gè)4位整數(shù)，分別如下：" + "\n" + numlist.join(",");
			}

			function findNum() {
				var find_5time = new Array();
				var i = 0,j = 0;
				while (i < numlist.length) {
					if (numlist[i] % 5 == 0) {
						find_5time[j] = numlist[i];
						j++;
					}
					i++;
				}
				display.value += "\n\n能被5整除的整數(shù)有：\n" + find_5time.join(",");
			}
		</script>
	</head>
	<body>
		<form method="post" action="">
			<textarea id="display" name="" rows="10" cols="50"></textarea>
			<br><br>
			<input type="button" value="生成20個(gè)4位整數(shù)" onclick="createNum();">
			<input type="button" value="找出能被5整除的整數(shù)" onclick="findNum();">
			<input type="reset">
		</form>
	</body>
</html>

網(wǎng)頁標(biāo)題：HTML屬性的事件處理器的應(yīng)用

錄入如下代碼，掌握HTML事件處理中的靜態(tài)指定方法。

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

<!doctype html>
<html>
<head>
<meta charset="utf-8">
	<title>HTML屬性的事件處理器的應(yīng)用</title>
    <script>
		function testInfo(message)
		{
			alert(message);
		}
	</script>

</head>

<body">
	<h4>HTML屬性的事件處理器的應(yīng)用</h4>
    <form method="post" action="">
    	<input type="button" value="通過JS語句輸出信息" onClick="alert('使用alert()輸出信息')">
        <input type="button" value="通過函數(shù)輸出信息" onClick="testInfo('調(diào)用testInfo()函數(shù)輸出信息')">
    </form>
</body>
</html>

網(wǎng)頁標(biāo)題：調(diào)用外部js文件的JavaScript函數(shù)

  • 錄入如下代碼，了解HTML事件處理中的動(dòng)態(tài)指定方法。
    • 其中HTML部分的代碼如下所示：

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

  • 網(wǎng)頁運(yùn)行時(shí)，不用單擊按鈕，由程序觸發(fā)打開對話框：

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

<!doctype html>
<html>
<head>
<meta charset="utf-8">
	<title>JavaScript中的動(dòng)態(tài)指定</title>
    <style>
		#inp{width:100px; height:40px; color:red;}
	</style>
    <script>
		function clickHandler()
		{
			alert("代碼觸發(fā)事件，即將提交表單！");
			return true;
		}
	</script>
</head>
<body>
	<form name="myform" method="post" action="">
    	<input id="inp" type="button" name="mybutton" value="提交">
    </form>
    <script>
		document.getElementById('inp').onclick=function(){return clickHandler();} //事件處理程序使用不帶函數(shù)名的funciton來定義
		myform.mybutton.onclick();  //程序觸發(fā)而不是鼠標(biāo)單擊，調(diào)用方法
	</script>
</body>
</html>

網(wǎng)頁標(biāo)題：給特定對象指定特定事件處理程序

  • 錄入如下代碼，熟練HTML事件處理中的特定對象的特定事件指定

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

  • 打開網(wǎng)頁即觸發(fā)load事件，彈出警示框：

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>給特定對象指定特定事件處理程序</title>
</head>
<body>
	<h4>給特定對象指定特定事件處理程序</h4>
    <script for="window" event="onload">
		alert("網(wǎng)頁讀取完成，歡飲光臨！");
	</script>
</body>
</html>

總結(jié)

Web 前端開發(fā)工程師應(yīng)掌握以下內(nèi)容

理解JavaScript程序的概念與作用；

掌握J(rèn)avaScript標(biāo)識符和變量的概念及使用方法；

掌握J(rèn)avaScript常用運(yùn)算符和表達(dá)式概念；

掌握J(rèn)avaScript中順序、分支、循環(huán)等3種程序控制結(jié)構(gòu)語法；

掌握J(rèn)avaScript函數(shù)的定義方法，并學(xué)會使用；

學(xué)會綜合運(yùn)用JavaScript設(shè)計(jì)具有動(dòng)態(tài)、交互功能的網(wǎng)頁。

希望你開心，希望你健康，希望你幸福，希望你點(diǎn)贊！

最后的最后，關(guān)注喵，關(guān)注喵，關(guān)注喵，佬佬會看到更多有趣的博客哦?。?！

喵喵喵，你對我真的很重要！

[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁,html,前端,html5,計(jì)算機(jī)學(xué)習(xí),javascript,css3文章來源地址http://www.zghlxwxcb.cn/news/detail-830038.html

到了這里，關(guān)于[HTML]Web前端開發(fā)技術(shù)25（HTML5、CSS3、JavaScript ）JavaScript基礎(chǔ)消息對話框告警框確認(rèn)框提示框命名規(guī)范1標(biāo)識符2關(guān)鍵字3保留字注釋標(biāo)識符和變量——喵喵畫網(wǎng)頁的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！

本文來自互聯(lián)網(wǎng)用戶投稿，該文觀點(diǎn)僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務(wù)，不擁有所有權(quán)，不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載，請注明出處： 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符，請點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋，一經(jīng)查實(shí)，立即刪除！

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包，優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包