JS例項學習筆記——w3cschool

lumiere發表於2019-02-16

基礎例項

  • write()
document.write("this is a string");//生成普通文字
document.write("<br>"+Date());//html+函式
document.write("<input type=`text`>");//html,生成標籤
  • JS程式碼塊
    JS中沒有塊作用域,只有函式作用域。JS程式碼塊只是把需要一起執行的語句進行分組。
  • prompt()
var name = prompt("please input your name:","Anne")//後面的引數為輸入框的預設值
  • confirm()
var yourChoice = confirm("please confirm your choice!")
//yourChoice == true,選擇了“確認”
//yourChoice == false,選擇了“取消”
  • break
    中斷,switch,if等語句
  • continue
    跳出本次迴圈,繼續下次迴圈
  • for in
    遍歷陣列內元素
for(index in Array)//index為陣列內元素索引,從0開始
  • onerror事件
    捕獲網頁中的錯誤。(chrome、opera、safari 瀏覽器不支援)
    只要頁面中出現指令碼錯誤,就會產生 onerror 事件。如果需要利用 onerror 事件,就必須建立一個處理錯誤的函式。你可以把這個函式叫作 onerror 事件處理器 (onerror event handler)。這個事件處理器使用三個引數來呼叫:msg(錯誤訊息)、url(發生錯誤的頁面的 url)、line(發生錯誤的程式碼行)。
<html>
<head>
<script type="text/javascript">
onerror=handleErr
var txt=""

function handleErr(msg,url,l)
{
txt="There was an error on this page.

"
txt+="Error: " + msg + "
"
txt+="URL: " + url + "
"
txt+="Line: " + l + "

"
txt+="Click OK to continue.

"
alert(txt)
return true
}

function message()
{
adddlert("Welcome guest!")
}
</script>
</head>

<body>
<input type="button" value="View message" onclick="message()" />
</body>

</html>

高階例項

1、計時器

setTimeout(code,millisec)//在指定毫秒數之後呼叫函式或者計算表示式
//code為JS程式碼串
//只執行一次code
clearTimeout(id_of_settimeout)//可取消由 setTimeout() 方法設定的 timeout
//id_of_settimeout是由 setTimeout() 返回的 ID 值。該值標識要取消的延遲執行程式碼塊。

JS程式碼

<script type="text/javascript">
var c=0;
var t;//如果是無限迴圈計數器,可以不用設定變數t
function timedCount()
{
document.getElementById(`txt`).value=c;
c=c+1;
t=setTimeout("timedCount()",1000);
}

function stopCount()
{
c=0;
setTimeout("document.getElementById(`txt`).value=0",0);
clearTimeout(t);
}
</script>

HTML程式碼

<form>
<input type="button" value="開始計時!" onClick="timedCount()">
<input type="text" id="txt">
<input type="button" value="停止計時!" onClick="stopCount()">
</form>

相關文章