电竞比分网-中国电竞赛事及体育赛事平台

搜索
分享

javascript筆記

 司馬小賊 2018-02-28

最近整理了javascript的一些知識點~

引入js的用法：

  1. <!doctype html>  
  2. <html lang="en">  
  3.  <head>  
  4.   <meta charset="UTF-8">  
  5.   <meta name="Generator" content="EditPlus?">  
  6.   <title>index </title>  
  7.   <script type="text/javascript" src="results.js"/></script>  
  8.   <link rel="result.css" type="text/css"/>  
  9. </head>  
  10. <body>  
  11.   <p id="dateField"> </p>  
  12. </body>  
  13. </html>  

Date對象：

[javascript] view plain copy
 print?
  1. var myDate=new Date();  
  2. var dateString=myDate.toLocaleDateString()+"  "+myDate.toLocaleTimeString();  
  3. var dateLoc=document.getElementById("dateField");  
  4. dateLoc.innerHTML="Hello-Page Rendered on"+dateString;  

倒計時到將來某一天：

[javascript] view plain copy
 print?
  1. var today=new Date();  
  2. var then=new Date();  
  3. then.setFullYear(2012,0,1);  
  4. var diff=then.getTime()-today.getTime();  //getTime()得到的是以毫秒為單位。  
  5. diff=Math.floor(diff/(1000*60*60*24));  
  6. var dateLoc=document.getElementById("dateFiled");  
  7. dateLoc.innerHTML="There are"+diff+"days until 1/1/2012";  

計算渲染時間：

[javascript] view plain copy
 print?
  1. var started=new Date();  
  2.   
  3. var now=started.getTime();  
  4. var bottom=new Date();  
  5. var diff=(bottom.getTime()-now)/1000;  
  6. var finaltime=diff.toPrecision(5);  
  7. var dateLoc=document.getElementById("dateFiled");  
  8. dateLoc.innerHTML="Page rendered in"+finaltime+"seconds.";  

拖遲：

[javascript] view plain copy
 print?
  1. for(var i=0;i<100000;i++){  
  2. //delay  
  3. }  

正則表達式：

[javascript] view plain copy
 print?
  1. var myString="http://www.";  
  2. var myRegex=/http:\/\/\w+\.(.*)/;  
  3. var results=myRegex.exec(myString);  
  4. alert(results[1]);  

match 方法：

[javascript] view plain copy
 print?
  1. var emailAddr="suehring@braingia.com";  
  2. var myRegex=/\.com/;  
  3. var checkMatch=emailAddr.match(myRegex);  
  4. alert(checkMatch[0]);  

判斷一個給定的email地址是否包含字符串.com：

[javascript] view plain copy
 print?
  1. var emailAddr="suehring@braingia.com";  
  2. var myRegex=/\.com/;  
  3. var checkMatch=emailAddr.match(myRegex);  
  4. if(checkMatch!==null){  
  5. alert(checkMatch[0]);  
  6. }  

search方法：(返回的是第一次匹配的索引值（位置）)

[javascript] view plain copy
 print?
  1. var emailAddr="suehring@braingia.com";  
  2. var myRegex=/\.com/;  
  3. var searchResult=emailAddr.search(myRegex);  
  4. alert(checkMatch[0]);  

replace方法：

[javascript] view plain copy
 print?
  1. var emailAddr="suehring@braingia.com";  
  2. var myRegex=/\.com$/;  
  3. var replaceWith=".net";  
  4. var result=emailAddr.match(myRegex);  
  5. alert(result);  

使用detele操作符：

[javascript] view plain copy
 print?
  1. <span style="font-family:SimSun;font-size:12px;">var star={};  
  2. star["Polaris"]=new object;  
  3. star["Mizar"]=new object;  
  4. star["Aldebaran"]=new object;  
  5. star["Rigel"]=new object;  
  6. star["Polaris"].constellation="Ursa Minor";  
  7. star["Mizar"].constellation="Ursa Minor";  
  8. star["Aldebaran"].constellation="Ursa Minor";  
  9. star["Rigel"].constellation="Ursa Minor";  
  10. detele(star["Polaris"].constellation);  
  11.    
  12. for(starName in star){  
  13. var para=document.createElement('p');  
  14. para.id=starName;  
  15. para.appendChild(document.createTextNode(starName+":"+star[starName].constellation));  
  16. document.getElementsByTagName("body")[0].appendChild(para);  
  17. }</span>  

for in 循環(huán)：

[javascript] view plain copy
 print?
  1. for(var myProp in myObject){  
  2. alert(myProp+" ="+myObject[myProp]);  
  3. }  
  4. var star=new object;  
  5. star.name="";  
  6. star.type="";  
  7. star.constellation="";  
  8. for(var starProp in star){  
  9. alert(starProp+"="+star[starProp]);  
  10. }  
表單驗證：

  1. <!doctype html>  
  2. <html lang="en">  
  3.  <head>  
  4.   <meta charset="UTF-8">  
  5.   <meta name="Generator" content="EditPlus?">  
  6.   <title>情感分析結果</title>  
  7.   <script type="text/javascript" src="results.js"/></script>  
  8.   <link rel="result.css" type="text/css"/>  
  9.  </head>  
  10.  <body>  
  11.  <form id="myfrom" action="#" onsubmit="return alertName();">  
  12.  <p>Username:<input id="nametext" name="username" type="text"/></p>  
  13.  <p><input type="submit"/></p>  
  14.  </form>  
  15.  </body>  
  16. </html>  
  17. function alertName(){  
  18. var name=document.forms[0].nametext.value;  
  19. if(name=="steve"){  
  20. alert("Hello Steve. Welcome to Machine");  
  21. }  
  22. else if(name=="nancy"){  
  23. alert("Hello Tim.");  
  24. }  
  25. else{  
  26. alert("Hello"+name);  
  27. }  
  28. return true;  
  29. }  

Window對象的一些屬性：

close:窗口關閉時設置為true；

defaultStatus：用來設置出現(xiàn)在瀏覽器狀態(tài)欄中的默認文本；

name：窗口第一次被打開時所設置的窗口的名字；

opener：引用創(chuàng)建這個窗口的窗口；

parent:常常和幀一起使用，指創(chuàng)建特定窗口的窗口，或者該幀的上一級窗口；

status：常常用來設置當訪問者懸停在鏈接這樣的元素上的時候狀態(tài)欄中的文本；

top：最高或最頂層的父窗口；


window對象的一些方法：

addEventListener():跨瀏覽器（除了Internet Explorer）事件處理程序方法。

attachEvent():跨瀏覽器Internet Explorer事件處理程序方法。

blur():把鍵盤輸入的焦點從瀏覽器窗口移開。

focus():把鍵盤輸入的焦點移動到瀏覽器窗口。

close():關閉瀏覽器窗口。

detachEvent():跨瀏覽器Internet Explorer事件處理程序刪除方法。

removeEventListener():跨瀏覽器（除了Internet Explorer）事件處理程序刪除方法。

open():打開一個窗口。

print():導致調用瀏覽器的打印函數(shù)，其行為就像有人點擊了瀏覽器的print按鈕。


Window對象移動和調整窗口大小的方法：

moveBy():用來把窗口移動到一個相對位置

moveTo():用來把窗口移動到一個特定位置

resizeBy():用來按一相對量改變窗口大小

resizeTo():用來把窗口大小改變到一個特定大小

Window對象中與定時器相關的方法：

clearInterval():

clearTimeout():

setInterval():

setTimeout():


獲取有關屏幕的信息：

availHeight/availWidth(可用高度)/colorDepth/height/width（總高度）

e.g:alert(screen.availHeight);


獲取元素：

getElementById()和getElementsByTagName()

HTML集合：

Document.anchors

Document.forms

Document.images

Document.links


Window尺寸：

var w=window.innerWidth

|| document.documentElement.clientWidth

|| document.body.clientWidth;

 

var h=window.innerHeight

|| document.documentElement.clientHeight

|| document.body.clientHeight;

    本站是提供個人知識管理的網(wǎng)絡存儲空間，所有內容均由用戶發(fā)布，不代表本站觀點。請注意甄別內容中的聯(lián)系方式、誘導購買等信息，謹防詐騙。如發(fā)現(xiàn)有害或侵權內容，請點擊一鍵舉報。
    轉藏 分享 獻花（0）

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多