開始學習javaScript的小伙伴們，或者是正用到javaScipt的小猿們,都可以將它作為資料參考，基本知識還是很全的以及簡單應用；黃色標出的是關鍵的知識點及解說，可以以它為節點快速找到自己想要知識點；
1 document.write(“<p>dddd</p>”); 2 <button type=”button” οnclick=”alert(‘dd’)”>dd</button> 3 x=document.getElementById(“dd”); 4 x.innerHTML=”dd”; 5 .src.match(“dd”) 匹配正則表達式 中含有dd 6 如果有dd則它的值是dd ,否則是 null 7 8 x.style.color=”#ffffff” 給樣式賦值 9 if(x==""||isNaN(x)) 驗證輸入的x是否數字 10 <script src="myScript.js"></script> 引用腳本 11 true false 12 13 var cars=new Array(); 14 cars[0]="Audi"; 15 cars[1]="BMW"; 16 var cars=new Array("Audi","BMW","Volvo"); 數組 17 var person={firstname:"Bill", lastname:"Gates", id:5566}; 18 name=person.lastname; 19 name=person["lastname"]; 都可以 20 var x=message.toUpperCase(); 把文本轉換為大寫

函數：

1 function dd() 2 { 3 return ; 4 } 5 <button οnclick="myFunction('Bob','Builder')">點擊這里</button> 6 JavaScript 變量的生命期從它們被聲明的時間開始。 7 局部變量會在函數運行以后被刪除。 8 全局變量會在頁面關閉后被刪除。 9 === 全等（值和類型） x===5 為 true；x==="5" 為 false 10 11 var person={fname:"John",lname:"Doe",age:25}; 12 13 for (var x in person) 14 { 15 txt=txt + person[x]; 16 } 遍歷對象 17 18 function myFunction() 19 { 20 try 21 { 22 var x=document.getElementById("demo").value; 23 if(x=="") throw "empty"; 24 if(isNaN(x)) throw "not a number"; 25 if(x>10) throw "too high"; 26 if(x<5) throw "too low"; 27 } 28 catch(err) 29 { 30 var y=document.getElementById("mess"); 31 y.innerHTML="Error: " + err + "."; 32 } 33 } 自定義錯誤消息 34 35 function validate_required(field,alerttxt) 36 { 37 with (field) 38 { 39 if (value==null||value=="") 40 {alert(alerttxt);return false} 41 else {return true} 42 } 43 } 驗證 44 with (field) 45 { 46 apos=value.indexOf("@") 47 dotpos=value.lastIndexOf(".") 48 if (apos<1||dotpos-apos<2) 49 {alert(alerttxt);return false} 50 else {return true} 51 } 52 } 53 getElementsByTagName 通過類名 54 55 onmouseover-onmouseout 鼠標 移到 移出 56 57 <div id="div1"> 58 <p id="p1">這是一個段落。</p> 59 <p id="p2">這是另一個段落。</p> 60 </div> 61 62 <script> 63 var para=document.createElement("p"); 64 var node=document.createTextNode("這是新段落。"); 65 para.appendChild(node); 66 67 var element=document.getElementById("div1"); 68 element.appendChild(para); 69 </script> 70 71 <div id="div1"> 72 <p id="p1">這是一個段落。</p> 73 <p id="p2">這是另一個段落。</p> 74 </div> 75 76 <script> 77 var parent=document.getElementById("div1"); 78 var child=document.getElementById("p1"); 79 parent.removeChild(child); 80 </script> 對象增加 移出 內容 81 82 person=new Object(); 83 ? person.firstname="Bill" 84 person.lastname="Gates"; 創建對象 并賦值 85 86 function person(firstname,lastname,age,eyecolor) 87 { 88 this.firstname=firstname; 89 this.lastname=lastname; 90 this.age=age; 91 this.eyecolor=eyecolor; 92 } 93 94 myFather=new person("Bill","Gates",56,"blue"); 95 96 document.write(myFather.firstname + " is " + myFather.age + " years old."); 97 給 person創建對象 。對象有三個屬性 ，分別取名

1 x.toUpperCase(); 大寫 2 continue 3 4 var txt=""; 5 function message() 6 { 7 try 8 { 9 adddlert("Welcome guest!"); 10 } 11 catch(err) 12 { 13 txt="There was an error on this page.\n\n"; 14 txt+="Error description: " + err.message + "\n\n"; 15 txt+="Click OK to continue.\n\n"; 16 alert(txt); 17 } 18 } 19 </script> 拋出錯誤 字符串樣式 1 var str="Hello world!" 2 document.write(str.indexOf("Hello") 定位 0 3 4 var txt="Hello World!" 5 6 document.write("<p>Big: " + txt.big() + "</p>") 7 document.write("<p>Small: " + txt.small() + "</p>") 8 9 document.write("<p>Bold: " + txt.bold() + "</p>") 10 document.write("<p>Italic: " + txt.italics() + "</p>") 11 12 document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>") 13 document.write("<p>Fixed: " + txt.fixed() + "</p>") 14 document.write("<p>Strike: " + txt.strike() + "</p>") 15 16 document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>") 17 document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>") 18 19 document.write("<p>Lowercase: " + txt.toLowerCase() + "</p>") 20 document.write("<p>Uppercase: " + txt.toUpperCase() + "</p>") 21 22 document.write("<p>Subscript: " + txt.sub() + "</p>") 23 document.write("<p>Superscript: " + txt.sup() + "</p>") 24 25 document.write("<p>Link: " + txt.link("http://www.w3school.com.cn") + "</p>") 字符串樣式

JavaScript方法；

1 var str="Visit Microsoft!" 2 document.write(str.replace(/Microsoft/,"W3School")) 3 結果：Visit W3School! 4 5 document.write(Date()) 6 var d=new Date(); 7 document.write("從 1970/01/01 至今已過去 " + d.getTime() + " 毫秒"); 8 9 var d = new Date() 10 d.setFullYear(1992,10,3) 11 document.write(d) 設置時間 12 13 var d = new Date() 14 document.write (d.toUTCString()) 將當日的日期（根據 UTC）轉換為字符串。 15 16 var d=new Date() 17 var weekday=new Array(7) 18 weekday[0]="星期日" 19 weekday[1]="星期一" 20 weekday[2]="星期二" 21 weekday[3]="星期三" 22 weekday[4]="星期四" 23 weekday[5]="星期五" 24 weekday[6]="星期六" 25 26 document.write("今天是" + weekday[d.getDay()]) 27 28 function startTime() 29 { 30 var today=new Date() 31 var h=today.getHours() 32 var m=today.getMinutes() 33 var s=today.getSeconds() 34 // add a zero in front of numbers<10 35 m=checkTime(m) 36 s=checkTime(s) 37 document.getElementById('txt').innerHTML=h+":"+m+":"+s 38 t=setTimeout('startTime()',500) 39 } 40 41 function checkTime(i) 42 { 43 if (i<10) 44 {i="0" + i} 45 return i 46 } 47 </script> 48 </head> 49 50 <body οnlοad="startTime()"> 51 <div id="txt"></div> 網頁上顯示鐘 52 53 var mycars = new Array() 54 mycars[0] = "Saab" 55 mycars[1] = "Volvo" 56 mycars[2] = "BMW" 57 58 for (i=0;i<mycars.length;i++)// for (i in Array) 59 { 60 document.write(mycars[i] + "<br />") 61 } 數組遍歷 62 63 var arr = new Array(3) 64 arr[0] = "George" 65 arr[1] = "John" 66 arr[2] = "Thomas" 67 68 var arr2 = new Array(3) 69 arr2[0] = "James" 70 arr2[1] = "Adrew" 71 arr2[2] = "Martin" 72 73 document.write(arr.concat(arr2)) 合并輸出各項值 74 75 var arr = new Array(3); 76 arr[0] = "George" 77 arr[1] = "John" 78 arr[2] = "Thomas" 79 80 document.write(arr.join()); 81 82 document.write("<br />"); 83 84 document.write(arr.join(".")); 85 86 結果： 87 George,John,Thomas 88 George.John.Thomas 89 90 var arr = new Array(6) 91 arr[0] = "George" 92 arr[1] = "John" 93 arr[2] = "Thomas" 94 document.write(arr + "<br />") 95 document.write(arr.sort()) 96 結果： 97 George,John,Thomas,James,Adrew,Martin 98 Adrew,George,James,John,Martin,Thomas 99 排序 按A.B.C 100 101 function sortNumber(a, b) 102 { 103 return a - b 104 } 105 106 var arr = new Array(6) 107 arr[0] = "10" 108 arr[1] = "5" 109 arr[2] = "40" 110 arr[3] = "25" 111 arr[4] = "1000" 112 arr[5] = "1" 113 114 document.write(arr + "<br />") 115 document.write(arr.sort(sortNumber)) 排序 按值 116 Math.min(7.25,7.30) 返回較大 或較小的數 .max(2,4) 117 document.write(Math.random()) 返回隨機數

常數

1 圓周率 2 2 的平方根 3 1/2 的平方根 4 2 的自然對數 5 10 的自然對數 6 以 2 為底的 e 的對數 7 以 10 為底的 e 的對數 8 這是在 Javascript 中使用這些值的方法：（與上面的算數值一一對應） 9 Math.E 10 Math.PI 11 Math.SQRT2 12 Math.SQRT1_2 13 Math.LN2 14 Math.LN10 15 Math.LOG2E 16 Math.LOG10E 值 常數值

RegExp是正則表達式的縮寫

1 test() 方法檢索字符串中的指定值。返回值是 true 或 false。 2 例子： 3 var patt1=new RegExp("e"); 4 5 document.write(patt1.test("The best things in life are free")); 6 7 exec() 方法檢索字符串中的指定值。返回值是被找到的值。如果沒有發現匹配，則返回 null。 8 9 10 var patt1=new RegExp("e"); 11 12 document.write(patt1.exec("The best things in life are free")); 13 14 var patt1=new RegExp("e"); 15 16 document.write(patt1.test("The best things in life are free")); 17 18 patt1.compile("d"); 19 20 document.write(patt1.test("The best things in life are free")); 21 由于字符串中存在 "e"，而沒有 "d"，以上代碼的輸出是： 22 truefalse 正則表達式

BOM Window操作

1 window.innerHeight - 瀏覽器窗口的內部高度 2 window.innerWidth - 瀏覽器窗口的內部寬度 3 4 window.open() - 打開新窗口 5 window.close() - 關閉當前窗口 6 window.moveTo() - 移動當前窗口 7 window.resizeTo() - 調整當前窗口的尺寸 8 9 screen.availWidth 屬性返回訪問者屏幕的寬度，以像素計，減去界面特性，比如窗口任務欄 10 screen.availHeight 11 12 location.hostname 返回 web 主機的域名 13 location.pathname 返回當前頁面的路徑和文件名 14 location.port 返回 web 主機的端口 （80 或 443） 15 location.protocol 返回所使用的 web 協議（http:// 或 https://） 16 location.href 屬性返回當前頁面的 URL。 17 18 <script> 19 function newDoc() 20 { 21 window.location.assign("http://www.w3school.com.cn") 22 } 23 </script> 24 </head> 25 <body> 26 27 <input type="button" value="加載新文檔" οnclick="newDoc()"> 28 29 history.back() - 與在瀏覽器點擊后退按鈕相同 30 history.forward() - 與在瀏覽器中點擊按鈕向前相同 對window的操作

confirm在彈出內輸入內容，并控制時間彈出setTimeout

1 function show_confirm() 2 { 3 var r=confirm("Press a button!"); 4 if (r==true) 5 { 6 alert("You pressed OK!"); 7 } 8 else 9 { 10 alert("You pressed Cancel!"); 11 } 12 } 13 </script> 14 </head> 15 <body> 16 17 <input type="button" οnclick="show_confirm()" value="Show a confirm box" /> 18 19 20 21 22 function disp_prompt() 23 { 24 var name=prompt("請輸入您的名字","Bill Gates") 25 if (name!=null && name!="") 26 { 27 document.write("你好！" + name + " 今天過得怎么樣？") 28 } 29 } 30 </script> 31 </head> 32 <body> 33 34 <input type="button" οnclick="disp_prompt()" value="顯示提示框" /> 輸入 35 36 function timedMsg() 37 { 38 var t=setTimeout("alert('5 秒！')",5000) 39 } 5秒后顯示 40 41 42 var c=0 43 var t 44 function timedCount() 45 { 46 document.getElementById('txt').value=c 47 c=c+1 48 t=setTimeout("timedCount()",1000) 49 } 50 </script> 51 </head> 52 53 <body> 54 55 <form> 56 <input type="button" value="開始計時！" onClick="timedCount()"> 57 <input type="text" id="txt"> 58 </form> 59 60 <p>請點擊上面的按鈕。輸入框會從 0 開始一直進行計時。</p> 61 62 clearTimeout(t); confirm and setTimeout

基本jQuery與JavaScript區別；

1 JavaScript 方式： 2 function myFunction() 3 { 4 var obj=document.getElementById("h01"); 5 obj.innerHTML="Hello jQuery"; 6 } 7 οnlοad=myFunction; 8 等價的 jQuery 是不同的： 9 jQuery 方式： 10 function myFunction() 11 { 12 $("#h01").html("Hello jQuery"); 13 } 14 $(document).ready(myFunction);

前端學習網站推薦： http://www.w3school.com.cn/ ?

本人正在努力學習中，希望在未來能為大家分享更多更深的知識；

轉載于:https://www.cnblogs.com/woloveprogram/p/4384325.html

總結

以上是生活随笔為你收集整理的JavaScript文档的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。