菜鳥javascript基礎整理1

更新時間：2010年12月06日 20:30:16 作者：

JavaScript 基礎基礎，雖然基礎但是很實用。

1

//頁面中寫入html內容 
document.write("<h1>Hello World!</h1>")

2

復制代碼代碼如下:

//為了防止不支持 JavaScript 的瀏覽器把js當作為頁面的內容來顯示 
//注釋行末尾的兩個正斜杠是 JavaScript 的注釋符號，它會阻止 JavaScript 編譯器對這一行的編譯。 
<script type="text/javascript"> 
<!-- 
document.write("Hello World!"); 
//--> 
</script>

3

復制代碼代碼如下:

//onload事件的多種寫法 
//第一種通過body標簽加入onload事件 
<script type="text/javascript"> 
function message(){ alert("該提示框是通過 onload 事件調用的。");} 
</script> 
<body onload="message()"> 
//第二種直接用window函數(shù)調用onload事件 
<script type="text/javascript" language="javascript"> 
window.onload=message; 
function message(){ alert("該提示框是通過 onload 事件調用的。"); } 
</script>

4
//JavaScript 放置的位置
當頁面載入時，會執(zhí)行位于 body 部分的 JavaScript。(直接執(zhí)行)
當被調用時，位于 head 部分的 JavaScript 才會被執(zhí)行。
head 部分
包含函數(shù)的腳本位于文檔的 head 部分。這樣我們就可以確保在調用函數(shù)前，腳本已經載入了。

5.
//分號的作用
//分號是可選的（根據(jù) JavaScript 標準），瀏覽器把行末作為語句的結尾,通過使用分號，可以在一行中寫多條語句。

6。
//JavaScript 變量名稱的規(guī)則：
變量對大小寫敏感（y 和 Y 是兩個不同的變量）
變量必須以字母或下劃線開始

7。
//變量的聲明
如果您所賦值的變量還未進行過聲明，該變量會自動聲明。
例:
x=5; carname="Volvo";
與后面的這些語句的效果相同：var x=5; var carname="Volvo";

8。
//比較運算符
運算符描述例子
=== 全等（值和類型） x===5 為 true； x==="5" 為 false

9。
//條件運算符(三目運算符)
JavaScript 還包含了基于某些條件對變量進行賦值的條件運算符。
name=("liuhuan"=="LH")?"劉歡":"歌星";

10。
//獲得當前系統(tǒng)時間(小時數(shù))
var d = new Date()
var time = d.getHours()

11。
//隨機數(shù)
var num=Math.random();
產生的偽隨機數(shù)介于 0 和 1 之間（含 0，不含 1），也就是，返回值可能為0，但總是小于1。在第一次加載 JScript 時隨機數(shù)發(fā)

生器自動產生。

12。
//獲取今天的星期數(shù)(星期日為0，星期1-6為1-6)
var d = new Date()
theDay=d.getDay()

13。
//按鈕的觸發(fā)事件
<input type="button" onclick="disp_alert()" value="顯示警告框" />

14。
//彈出框內容換行
alert("再次向您問好！在這里，我們向您演示" + '\n' + "如何向警告框添加折行。")

15.
//確認框(刪除方法)
//confirm("文本")
<script type="text/javascript">
function show_confirm()
{
var r=confirm("確認刪除?");
if (r==true) {
   alert("刪除成功!");
   }
else{
   alert("刪除失敗!");
   }
}
</script>

16.
//于用戶交互的彈出框(可輸入文字的提示框)
//prompt("文本","默認值")
<script type="text/javascript">
function disp_prompt()
{
var name=prompt("請輸入您的名字","Bill Gates")
if (name!=null && name!=""){
document.write("你好！" + name + " 今天過得怎么樣？")
}
}
</script>

17。
//帶有參數(shù)并返回值的函數(shù)
<head>
<script type="text/javascript">
function product(a,b)
{
return a*b;
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(product(6,5))
</script>
</body>

18。
//for循環(huán) (本例中動態(tài)生成html中的h標簽)
<body>
<script type="text/javascript">
for (i = 1; i <= 6; i++){
document.write("<h" + i + ">這是標題 " + i)
document.write("</h" + i + ">")
}
</script>
</body>

19。
//break跳出語句
<script type="text/javascript">
var i=0
for (i=0;i<=10;i++){
if (i==3){break}
document.write("數(shù)字是 " + i)
document.write("<br />")
}
</script>
<p>解釋：循環(huán)會在 i=3 時中斷。</p>

20。
//continue跳出語句
<script type="text/javascript">
var i=0
for (i=0;i<=10;i++){
if (i==3){continue}
document.write("數(shù)字是 " + i)
document.write("<br />")
}
</script>
<p>解釋：當 i=3 時，會中斷循環(huán)，并從下一個值開始繼續(xù)循環(huán)。</p>
值為:01245678910

21。
//for in循環(huán)(相當于.net中的foreach循環(huán))
<html>
<body>
<script type="text/javascript">
var x
var mycars = new Array()
mycars[0] = "寶馬"
mycars[1] = "奔馳"
mycars[2] = "賓利"

for (x in mycars)
{
document.write("x的值為"+x+ "<br />");
document.write(mycars[x] + "<br />")
}
</script>
</body>
</html>

22。
//javascript事件
onload 某個頁面或圖像被完成加載 //頁面加載
onunload 用戶退出頁面

onfocus 元素獲得焦點
onblur 元素失去焦點 //表單驗證
onchange 用戶改變域的內容
onreset 重置按鈕被點擊
onsubmit 提交按鈕被點擊 //用于在提交表單之前驗證所有的表單域。
例如:
(當用戶單擊表單中的確認按鈕時，checkForm() 函數(shù)就會被調用。checkForm() 函數(shù)的返回值是 bool類型,如果返回值為true，則

提交表單，反之取消提交。)
<form method="post" action="xxx.htm" onsubmit="return checkForm()">

onkeydown 某個鍵盤的鍵被按下
onkeypress 某個鍵盤的鍵被按下或按住 //鍵盤操作
onkeyup 某個鍵盤的鍵被松開

onclick 鼠標點擊某個對象
ondblclick 鼠標雙擊某個對象
onmousedown 某個鼠標按鍵被按下    //鼠標操作
onmousemove 鼠標被移動
onmouseout 鼠標從某元素移開
onmouseover 鼠標被移到某元素之上
onmouseup 某個鼠標按鍵被松開

onabort 圖像加載被中斷
onerror 當加載文檔或圖像時發(fā)生某個錯誤

onresize 窗口或框架被調整尺寸
onselect 文本被選定

23。
//js中的錯誤提示 err.description及其try...catch 語句
例如:
<script type="text/javascript">
var txt=""
function message(){
try{
   adddlert("Welcome guest!")
   }
catch(err){
   txt="本頁中存在錯誤。\n\n"
   txt+="錯誤描述：" + err.description + "\n\n"
   txt+="點擊“確定”繼續(xù)。\n\n"
   alert(txt);
   }
}
</script>

24。
//帶有確認框的 try...catch 語句
<head>
<script type="text/javascript">
var txt=""
function message(){
try{
    adddlert("Welcome guest!")
    }
catch(err){
   txt="本頁中存在錯誤。\n\n"
   txt+="點擊“確定”繼續(xù)查看本頁，\n"
   txt+="點擊“取消”返回首頁。\n\n"
   if(!confirm(txt))
   {
   document.location.href="../index.html"
   }
    }
}
</script>
</head>
<body>
<input type="button" value="查看消息" onclick="message()" />
</body>

25。
//創(chuàng)建 exception（異常或錯誤）。(配合try...catch語句使用)
例如:
<script type="text/javascript">
var x=prompt("請輸入 0 至 10 之間的數(shù)：","")
try{
if(x>10)
throw "Err1"
else if(x<0)
throw "Err2"
else if(isNaN(x))
throw "Err3"
}
catch(er){
if(er=="Err1")
alert("錯誤！該值太大！")
if(er == "Err2")
alert("錯誤！該值太?。?)
if(er == "Err3")
alert("錯誤！該值不是數(shù)字！")
}
</script>

26。
//return true和return true的用法
(它可以返回一個bool型的參數(shù),繼續(xù)用于判斷)
function jiance(msg,url,l){
alert("你確定嗎?")
return true
}
function jieguo(){
if(jiance()){
alert("是");
}
else{
alert("否");
}
}

27.
//onerror 事件
<html><head>
<script type="text/javascript">
//當出現(xiàn)錯誤時觸發(fā)onerror事件
onerror=handleErr;
var txt=""
function handleErr(msg,url,l){
txt="本頁中存在錯誤。\n\n"
txt+="錯誤：" + msg + "\n"
txt+="URL: " + url + "\n"
txt+="行：" + l + "\n\n"
txt+="點擊“確定”繼續(xù)。\n\n"
alert(txt)
return true
}
function message(){
adddlert("確定嗎?")
}
</script>
</head><body>
<input type="button" value="查看消息" onclick="message()" />
</body></html>