Javascript基礎筆記總結

對象 描述
Document代表整個 HTML 文檔,可被用來訪問頁面中的所有元素
Anchor代表 <a> 元素
Area代表圖像映射中的 <area> 元素
Base代表 <base> 元素
Body代表 <body> 元素
Button代表 <button> 元素
Event代表某個事件的狀態
Form代表 <form> 元素
Frame代表 <frame> 元素
Frameset代表 <frameset> 元素
Iframe代表 <iframe> 元素
Image代表 <img> 元素
Input button代表 HTML 表單中的一個按鈕
Input checkbox代表 HTML 表單中的複選框
Input file代表 HTML 表單中的文件上傳
Input hidden代表 HTML 表單中的隱藏域
Input password代表 HTML 表單中的密碼域
Input radio代表 HTML 表單中的單選按鈕
Input reset代表 HTML 表單中的重置按鈕
Input submit代表 HTML 表單中的確認按鈕
Input text代表 HTML 表單中的文本輸入域(文本框)
Link代表 <link> 元素
Meta代表 <meta> 元素
Object代表 <Object> 元素
Option代表 <option> 元素
Select代表 HTML 表單中的選擇列表
Style代表單獨的樣式聲明
Table代表 <table> 元素
TableData代表 <td> 元素
TableRow代表 <tr> 元素
Textarea代表 <textarea> 元素

........................................................................
<script type="text/javascript">
JS方法
</script>
或者
<script lanuage="javascript">
JS方法
</script>
..................................................................
script可以出現在頁面任何地方。
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
如:<script language="javascript">
document.write(<br>可以在頁面顯示</br>);
..................................................................
javascript中定義是區分大小寫的。是弱類型的。

外部引用:
<script language="javascript" src="testjs.js"></script>

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
document.write("要輸出的信息!")
在body標籤裏面,才能顯示。
<script language="javascript">

var greeting;
greeting="親愛的,你還好嗎?";

</script>
</head>

<body>
<script language="javascript">

document.write(greeting);//頁面顯示:親愛的,你還好嗎?

</script>

</body>
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
.....................................................................

<Script Language="JavaScript">
   var arr = new Array(3);//可以這樣定義,但是沒有意義
   arr[0] = 1;
   arr[1] = 2;
   arr[2] = 3;
   arr[3] = 4;
   arr["rrr"] = 4090;
</Script>
數組也可以這樣定義:var arr=new Array(2,3,34,5);數組中存取的元素即是:
2,3,34,5
..................................................................
<Script language="JavaScript">
  for(var o in arr) {
   
   document.write("<br>"+arr[o]);//支持字符串連接
  }
  
  for(var o in arr){
   document.write(o)//o代表數組arr的下標值
                                        //0,1,2,3,rrr
  }
</Script>
....................................................................

Javascript調試:
IE-工具-Internet選項-高級 打開禁用腳本調試,顯示每一個錯誤通知。

...................................................................
Javascript的算術運算和邏輯運算。
都可以先聲明,然後再複製,然後再運算。

....................................................................
javascript中,字符串的截取操作是: 
greeting = "Welcome to the JS!";
greeting.substring(9,8)//意思是前9個字符中,截取掉前8個,剩下最後一個。
......................................................................

<Script language="JavaScript">
 var today = new Date();
 var hour = today.getHours();
 if(hour<12)
 {
   document.write("Good Morning");
 }
 else if(hour == 12)
 {
   document.write("Good Noon!");
 } 
 else
 {
   document.write("Good Afternoon!");
 }
 </Script>
..................................................................
window指的是當前窗口。
window.location和document.location是一樣的意思。都是指當前頁面的url的
值。
....................................................................
<Script language="JavaScript">
 var userName = prompt("請輸入你的名字:");
   document.write("你好!"+userName);
</Script>
//這個屬性不常用。
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
str.charCodeAt(i)<255表示的是數字與字母類型的。
relative
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
刪除提示:
 <Script language="JavaScript">
 function confirmit()
 {
   if(confirm("你確認刪除此文件麼?"))
   {
    document.testa.submit();
   }
  }   
 </Script> 
 </head>
 <body>
 <form name="testa" action="ttt.jsp" method="post">
  <!----><input type="button" value="刪除文件" onClick="JavaScript:confirmit()" name="aaa">
        <input type="button" value="刪除文件" onClick="return confirmit()" name="aa">
 </form>
 </body>
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。


下面測試一下在javascript中this的用法。
其實要看this出現在哪一個標籤中,就是代表當前標籤的對象。因爲javascript
就是面向對象的腳本語言。
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
例子:
<body>
 <img src="xsd.jpg" onClick="JavaScript:alert(this.src);">
 <form name="ttt">
 <input type="text" name="ddd" value="ddaaa" onClick="JavaScript:checkit(this)">
 </form>
 </body>
</html>
<Script language="JavaScript">
function checkit(obj)
{
 if(obj.value=="")
 {
  alert("空值");
 }
 else
 {
  alert(obj.value);
 }
}
</Script>
....................................................................
<body onLoad="window.status='Hello,Please look here!'">

 
 <form name="ttt">
  <input type="button" value="test" onMouseOver="window.status='haha';">
 </form>
 </body>

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。


//下面是改變窗體狀態欄的。
<body onLoad="window.status='Hello,Please look here!'">

 
 <form name="ttt">
  <input type="button" value="test" onMouseOver="window.status='haha';">
 </form>
</body>

.......................................................................

彈出窗口的代碼:

 <Script language="JavaScript">
 //window.open("1.htm","newWin","toolbar=no,left=200,top=100,menubar=no,width=100,height=100,resizable=no");
   window.open("1.htm","newWin","toolbar=no,left=200,top=100,menubar=no,width=100,height=100,resizable=no");
 //window.open("1.htm");
 </Script>
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
下面顯示通過按鈕來操作另一個頁面:
<body>
 <Script language="JavaScript">
 var abc = window.open("1.htm","newWin","toolbar=no,left=200,top=100,menubar=no,width=300,height=100");
 </Script>
 <input type="button" onClick="JavaScript:abc.focus();" value="跑前面來">
   
 <input type="button" onClick="JavaScript:abc.close();" value="關閉">
   
 </body>

......................................................................

下面是獲得當前頁面的瀏覽器地址:
<body>
 <Script language="JavaScript">
 alert(window.location);
 alert(document.location.href);
 </Script>
</body>
.....................................................................
32.htm

<body>
 <Script language="JavaScript">
 function go2()
 {
   window.location="33.htm";
 }
 </Script>
 <input type="button" value="轉向" onClick="JavaScript:go2()">
</body>

....................................................................

33.htm

<body>
 <Script language="JavaScript">
 function goBack()
 {
   history.back();
 }
 </Script>
 <input type="button" value="返回" onClick="JavaScript:goBack()">
</body>

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

顯示停留在當前頁面的時間:
<BODY>
 <form name="myform">
  您在此停留了:
  <input name="clock" size="18" value="在線時間">
 </form>

 <Script language="JavaScript">
 
 var id, iM = 0, iS = 1;
 
 start = new Date();

 function go()
 {
  now = new Date();
  time = (now.getTime() - start.getTime()) / 1000;
  time = Math.floor( time);
  
  //秒
  iS = time % 60;
  //分
  iM = Math.floor( time / 60);

  if ( iS < 10)
   document.myform.clock.value = " " + iM + " 分 0" + iS + " 秒";
  else
   document.myform.clock.value = " " + iM + " 分 " + iS + " 秒";
  id = setTimeout( "go()", 1000);//這個方法是每隔1000ms執行一次go()方法。
 }
 go();
    </Script>

</BODY>
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

框架顯示:

<FRAMESET COLS="150,*" BORDER=1 FRAMEBORDER=1 FRAMESPACING=1>
 <FRAME SRC="1.htm" NAME="topds">
 <FRAME SRC="2.htm" NAME="mainasfasd">
</FRAMESET>
<noframes>

</noframes>

......................................................................

驗證email格式:

 

<HEAD>
  <Script Language="JavaScript">

   function check()
   {
    var tmp,str2;
    //獲得text1的值
    str2=document.myform.text1.value;
    
    tmp=str2.indexOf('@');
    
    if(tmp<0)
     //字符串中不包含@字符
     alert("請輸入合法Email地址");
    else
     //輸出 @ 的位置
     alert(tmp);
   }
   
  </Script>
 </HEAD>

 <BODY>
   <form name="myform">
  請輸入Email地址:<br>
  <input type=text value="" name="text1">
  <p><input type=button value="提交" name="btn1" onClick="check()">
   </form> 
 </BODY>


。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。


onChange="JavaScript:alert(document.test.userName.value);"

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
//屬性:onLoad和onUnload的屬性測試:

<body onLoad="javascript:alert('hello');"
 onUnload="javascript:alert('bye-bye');">
  nihao
 </body>

 

 

 

 

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