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>