js發現的細節問題一

1.js元素的innerHTML屬性後面添加的內容是替換原標籤的內容,而不是在原標籤的內容後面添加。

運行下面的例子:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>

<style type="text/css">
.highlight{
 color:red;
}
</style>
<script type="text/javascript">
//var showBrowerType=function(){
// document.getElementById("readout").innerHTML="Your Brower say is :"+"<span class='highlight'>"
// +window.navigator.userAgent+"</span>.<hr/>";
//}
//在js外面加載js方法window.onload當頁面加載時調用某些函數
window.οnlοad=showBrowerType;
</script>
</head>

<body>
<h1>abcdanklac</h1>
<hr/>
<h1>svdvsfv</h1>
<hr />
<div id="readout">aaaa</div>
</body>
</html>

運行結果如下:

如上圖所示<div>標籤裏面的內容是aaaa,但是把<script>裏面的下面代碼去掉註釋,則顯示如下圖結構

//var showBrowerType=function(){
// document.getElementById("readout").innerHTML="Your Brower say is :"+"<span class='highlight'>"
// +window.navigator.userAgent+"</span>.<hr/>";
//}

由此可見原<div>標籤裏面的內容被替換掉了,不信你試試。

 

2.js中的window.onload方法表示頁面加載時調用方法:例如

var a=function(){

}

window.οnlοad=a;

表示頁面加載時調用a函數。

 

3.javascript中有三種消息框:警告框,確認框,提示框。

實例如下:

警告框:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<script type="text/javascript">
var al=function(){
 alert("你好");
 alert("你好"+"\n"+"我也好!")
}
</script>
</head>

<body>
<input type="button"  οnclick="al()" value="顯示警告框"/>
</body>
</html>

確認框:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<script type="text/javascript">
var cof=function(){
 var r=confirm("please press a button");
 if(r==true){
  alert("以按下確認消息");
 }else{
  alert("以按下取消消息");
  }
 }
</script>
</head>

<body>
<input type="button" οnclick="cof()" value="顯示確認框"/>
</body>
</html>

提示框:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<script type="text/javascript">
var show=function(){
 var  name=prompt("請輸入你的名字","jt");
 alert(name);
 if(name!=null && name!="")
 {
  document.write("你好!"+name+"今天過得怎麼樣?");
 }
}
</script>
</head>

<body>
<input type="button" οnclick="show()" value="顯示提示框"/>
</body>
</html>

 

 

 

 

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章