變量
- JavaScript的變量為弱類型變量髓堪，可以用來保存任何類型的數(shù)據(jù)档叔。
- var 可以聲明各種類型的數(shù)據(jù)
- 在JavaScript中瓶佳，允許不聲明變量而直接使用芋膘，系統(tǒng)將會自動聲明該變量。此方法容易出錯霸饲，不推薦使用为朋。
- 不推薦使用未顯式聲明變量理由1:
JavaScript中，若嘗試為未聲明的變量賦值厚脉，JavaScript會自動隱式聲明該變量习寸。但隱式聲明的變量總是會被創(chuàng)建為全局變量。 - 不推薦使用未顯式聲明變量理由2：
會造成與內置函數(shù)名字相同而使用混亂的情況傻工，從而引起JavaScript中變量類型讓人捉摸不透的局面霞溪。
- 不推薦使用未顯式聲明變量理由1:
- typeof 檢測變量的數(shù)據(jù)類型，運算符返回一個用來表示表達式的數(shù)據(jù)類型的字符串中捆。
- undefined：變量被聲明后鸯匹，但未被賦值
- string：用單引號或雙引號來聲明的字符串
- boolean：true或false
- number：整數(shù)或浮點數(shù)
- object：JavaScript中的對象、數(shù)組和null
等于（==）的情況下 只要值相同就返回true
全等（===）的時候需要值和類型都要匹配才能返回true
//取于后的符號泄伪，和第一個數(shù)有關
document.write(10%-3+"<br>");//1
document.write(-10%3+"<br>");//-1
document.write(-10%-3+"<br>");//-1
函數(shù)調用方式
-
和頁面元素的事件一起使用殴蓬，調用格式：事件名＝“函數(shù)名( )" ;
<input type="button" name="btn" value="顯示Hello" onclick="showHello()" />
-
通過找到要提供事件的對象，觸發(fā)對應的事件
var btn = document.getElementById("loginbtn"); btn.onclick = math; //點擊后觸發(fā)
math() math蟋滴，如果函數(shù)加括號就直接執(zhí)行函數(shù)了染厅，不加括號痘绎，則相當于將函數(shù)作為參數(shù)變量賦值給了btn.onclick屬性，并不立即執(zhí)行函數(shù)肖粮，而是點擊后觸發(fā)
匿名函數(shù)：屬于函數(shù)表達式孤页，匿名函數(shù)有很多作用，賦予一個變量則創(chuàng)建函數(shù)涩馆，賦予一個事件則成為事件處理程序
方式二匿名函數(shù)的調用涉及document對象的方法getElementById(); 該方法含義是通過指定的id屬性獲取頁面元素行施，下面代碼通過id屬性獲取了一個按鈕對象，然后給該按鈕的onclick事件綁定了匿名函數(shù)：
var hereOrThere = function(){alert("here");}//賦值給變量
btn.onclick = function(){}//賦值給事件
方式三： (function (){…}())
( );優(yōu)先表達式：由于Javascript執(zhí)行表達式是從圓括號里面到外面凌净，所以可以用圓括號強制執(zhí)行聲明的函數(shù)悲龟。
變量的作用域
變量的執(zhí)行環(huán)境有兩種——全局（script標簽內）和局部（函數(shù)內）
-
注意：函數(shù)體內不加var關鍵字定義的變量是全局變量，加var關鍵字定義的變量是局部變量冰寻，作用域僅限于函數(shù)內部
var tt = 'aa'; function test(){ alert(tt); var tt = 'dd'; alert(tt); } test(); 結果undefined、dd
數(shù)組
-
使用數(shù)組直接量實現(xiàn)
var arr1 = [ ]; 空的數(shù)組直接量 var arr2 = [ 1,true, "string",[1,2] ]; //包含具體元素的數(shù)組直接量 -
使用Array構造函數(shù)來實現(xiàn)數(shù)組
var arr = new Array();//空數(shù)組 var arr = new Array(1,2,3,4);//實數(shù)組 -
使用for循環(huán)可以遍歷js數(shù)組
var arr = new Array(1,2,3,4); for(var i=0;i<arr.length;i++){ arr[i] = arr[i]/2.0; } alert(arr); -
使用for in循環(huán)也可以遍歷js數(shù)組
var mycars = new Array() mycars[0] = "Saab" mycars[1] = "Volvo" mycars[2] = "BMW" for (var x in mycars) { document.write(mycars[x] + "<br />") } -
push(元素)：將一個或多個新元素添加到數(shù)組結尾皿渗，并返回數(shù)組新長度斩芭。
var a = [1,2,3,4,5]; a.push(6,7); -
unshift(元素)：將一個或多個新元素添加到數(shù)組開始，數(shù)組中的元素自動后移乐疆，返回新數(shù)組長度划乖。
var a = [1,2,3,4,5]; a.unshift(-2,-1); -
pop(); 移除最后一個元素并返回該元素值
var a = [1,2,3,4,5]; a.pop(); -
shift();移除最前一個元素并返回該元素值，數(shù)組中元素自動前移挤土。
var a = [1,2,3,4,5]; a.shift(); -
splice(開始位置琴庵，刪除長度)
var a = [1,2,3,4,5]; a.splice(1,2) -
splice(開始位置，刪除長度仰美，插入的元素)
var a = [1,2,3,4,5]; a.splice(1,2,[3,3,3]) -
concat()連接兩個數(shù)組迷殿，返回一個新數(shù)組(不會改變原數(shù)組)
var a = [1,2,3,4,5]; var b = [6,7,8]; var c = a.concat(b); -
數(shù)組元素的字符串化，join(分隔符)用分隔符咖杂，組合數(shù)組元素庆寺，生成字符串。省略分隔符話則用默認用逗號為分隔符
var a = [1,2,3,4,5]; var b = a.join("/") -
reverse();反轉元素(最前的排到最后诉字、最后的排到最前)懦尝，返回數(shù)組地址
var a = [1,2,3,4,5]; a.reverse(); -
sort(sortby);調用數(shù)組每個元素的toString()方法。然后對數(shù)組元素排序壤圃，返回數(shù)組地址陵霉。
-
當sortby參數(shù)不存在時，將按字母順序對數(shù)組中的元素進行排序伍绳。
var arr = ["p","z","e","c"]; arr.sort(); -
如果是數(shù)字踊挠，將以字符串的形式比較大小，所以要使用sortby參數(shù)定義排序規(guī)則
var a=[15,8,25,3]; a.sort(function(a, b) { return a-b;}); //[3,8,15,25]
解釋：a,b表示數(shù)組中的任意兩個元素墨叛，若return > 0 b前a后止毕；reutrn < 0 a前b后模蜡；a=b時位置不動
簡化一下：a-b輸出從小到大排序，b-a輸出從大到小排序扁凛。var a=["1px","12px","17px","8px","2px","21px"]; a.sort(function(a,b){ a = parseInt(a) b = parseInt(b) return a-b; } -
window對象的常用方法
- prompt 顯示可提示用戶輸入的對話框
- alert 顯示帶有一個提示信息和一個確定按鈕的警示框
- confirm 顯示一個帶有提示信息忍疾、確定和取消按鈕的對話框
- close 關閉瀏覽器窗口
- open 打開一個新的瀏覽器窗口，加載給定 URL 所指定的文檔
- setTimeout 在指定的毫秒數(shù)后調用函數(shù)或計算表達式
- setInterval 按照指定的周期（以毫秒計）來調用函數(shù)或表達式
window對象的常用屬性
screen 有關客戶端的屏幕和顯示性能的信息
history 有關客戶訪問過的URL的信息
location 有關當前 URL 的信息
-
history對象常用方法
- back()方法加載歷史列表中的前一個 URL谨朝。后退
- forward()方法加載歷史列表中的下一個 URL卤妒。前進
- go()：history.go(1)前進、history.go(0)刷新字币、history.go(-1)后退
-
location對象常用屬性和方法
- href屬性設置或返回當前頁面的 URL则披。
- reload()方法刷新當前頁面。
-
document對象的常用屬性
- referrer 返回載入當前文檔的文檔的URL
- URL 返回當前文檔的URL
-
document對象的常用方法
- getElementById() 返回對擁有指定id的第一個對象的引用
- getElementsByName() 返回帶有指定名稱的對象的集合
- getElementsByTagName() 返回帶有指定標簽名的對象的集合
- write() 向文檔寫文本洗出、HTML表達式或JavaScript代碼
innerHTML屬性 設置或獲取位于對象起始和結束標簽內的 HTML
outerHTML 設置或獲取對象及其內容的 HTML 形式
visibility屬性 visible 表示元素是可見的 hidden 元素是不可見的
display屬性 none 元素不會被顯示 block 元素將顯示
DOM W3C定義的一套訪問和操作XML文檔的標準接口(API)
- CoreDom : js實現(xiàn)標準DOM方法和屬性
- XmlDom
- HtmlDom:html特有方法和屬性
2士复、xml和html的區(qū)別
- xml是html的超集，html是xml子集
- html是定型標記語法翩活，內部標記的作用和結構都是固定的
- xml沒有固定標記的阱洪，所有標簽標示的內容自定義。
<h1 id="love">選擇你喜歡的水果：</h1>
<input name="enjoy" type="checkbox" value="apple" />蘋果
<input name="enjoy" type="checkbox" value="banana" />香蕉
<input name="enjoy" type="checkbox" value="grape" />葡萄
<input name="enjoy" type="checkbox" value="pear" />梨
<input name="enjoy" type="checkbox" value="watermelon" />西瓜
<br />
<input name="btn" type="button" value="顯示圖片路徑" onclick="photoPath()" />
<br /><input name="btn" type="button" value="喜歡的水果" onclick="favoriteFruits()" />
<br /><input name="btn" type="button" value="改變圖片" onclick="change()" />
<script type="text/javascript">
//顯示圖片路徑
function photoPath(){
var path = document.getElementById('fruit');
alert(path.getAttribute('src'));
}
//喜歡的水果
function favoriteFruits(){
var enjs = document.getElementsByName('enjoy');
var str = '你喜歡的水果是：';
for(var i=0;i<enjs.length;i++){
if(enjs[i].checked){
str+='n'+enjs[i].getAttribute('value');
}
}
alert(str);
}
//改變圖片
function change(){
var imgs = document.getElementById('fruit');//找到要操作的元素
imgs.setAttribute('src', 'images/grape.jpg');//coredom操作
}
</script>
3菠镇、coreDom的常用方法
- getAttribute('屬性名')
- setAttribute('屬性名','屬性值')
4冗荸、根基層次結構查找節(jié)點屬性 如果編程時希望訪問某個元素的父元素，但又不知道父元素的ID利耍、name蚌本、tag，怎么辦隘梨？
- parentNode 父節(jié)點
- firstChild 第一個節(jié)點
- lastChild 最后一個節(jié)點
- nextSibling 最后一個兄弟節(jié)點
- previousSibling 上一個兄弟節(jié)點
- 注意：除IE外 大部分瀏覽器會將空格和回車識別為文本節(jié)點程癌。解決：coreDom.js
- 創(chuàng)建和增加節(jié)點 的方法
- createElement（）：創(chuàng)建節(jié)點
- appendChild（）：末尾追加方式插入節(jié)點
- insertBefore（）：在指定節(jié)點前插入新節(jié)點
- cloneNode（）：克隆節(jié)點
- removeChild() ：刪除節(jié)點
- replaceChild() ：替換節(jié)點
- 注意：xxxxchild()方法操作是要正確找到父級元素來使用。
5出嘹、HTMLDOM操作屬性簡化為 對象名.屬性名 進行讀寫
//添加新節(jié)點
function newNode(){
var oldNode = document.getElementById('sixty1');//要插入的節(jié)點
var image = document.createElement('img');//創(chuàng)建類型為img的圖片節(jié)點
image.setAttribute("src","images/newimg.jpg");//指定新節(jié)點的src屬性
document.body.insertBefore(image,oldNode);//在oldNode前插入image新節(jié)點
}
//賦值節(jié)點
function copyNode(){
var image=document.getElementById("sixty1");//要復制的節(jié)點
//參數(shù)false表示是否復制原始節(jié)點的子節(jié)點
var copyImage=image.cloneNode(false);//調用cloneNode復制
document.body.appendChild(copyImage);//指定節(jié)點末尾追加
}*/
//刪除圖片
function delNode(){
var imgs = document.getElementById('sixty1');//要刪除的圖片
document.body.removeChild(imgs);
//body為img的父級元素席楚，所以要根據(jù)父元素來刪除子元素
}
//替換圖片
function repNode(){
var imgOld = document.getElementById('sixty2');//要替換的舊圖片
var imgNew = document.createElement('img');//新圖片
imgNew.setAttribute('src','images/newimg.jpg');//設置新圖片屬性
document.body.replaceChild(imgNew, imgOld);
//body為img的父級元素，所以要根據(jù)父元素來刪除子元素
}
//增加一行
function addRow(){
var table = document.getElementById('myTable');
var newRow = table.insertRow(1);//插入到第一行税稼，返回行對象
var col1 = newRow.insertCell(0);//插入一個單元格td
col1.innerHTML = '三國演義';
var col2 = newRow.insertCell(1);
col2.innerHTML = '¥24.20';
col2.align='center';
}
//刪除第2行
function delRow(){
document.getElementById('myTable').deleteRow(1);
}
//修改標題
function updateRow(){
var uRow = document.getElementById('myTable').rows[0];
uRow.className='title';//設置元素為指定的class.title的樣式
}
//復制最后一行
function copyRow(){
var cRow = document.getElementsByTagName('tr');
var lsetTr = cRow[cRow.length-1];
var a = lsetTr.cloneNode(true);
document.getElementById('myTable').appendChild(a);
}
js設置獲取元素樣式
HTML元素.style.樣式屬性＝"值"
document.getElementById("titles").style.color="#ff0000";
JavaScript事件
- onchange 用戶改變域的內容
- onclick 鼠標點擊某個對象
- onerror 當加載文檔或圖像時發(fā)生某個錯誤
- onfocus 元素獲得焦點
- onblur 元素失去焦點
- onkeydown 某個鍵盤的鍵被按下
- onkeypress 某個鍵盤的鍵被按下并松開
- onkeyup 某個鍵盤的鍵被松開
- onload 某個頁面或圖像被完成加載
- onmousedown 某個鼠標按鍵被按下
- onmousemove 鼠標被移動
- onmouseout 鼠標從某元素移開
- onmouseover 鼠標被移到某元素之上
- onmouseup 某個鼠標按鍵被松開
制作隨鼠標滾動的廣告圖片
scrollTop 設置或獲取位于對象最頂端和窗口中可見內容的最頂端之間的距離
scrollLeft 設置或獲取位于對象左邊界和窗口中目前可見內容的最左端之間的距離
clientWidth 瀏覽器中可見內容的寬度烦秩，不包括滾動條等邊線，會隨窗口的顯示大小改變
-
clientHeight 瀏覽器中可以看到內容的區(qū)域的高度
document.documentElement.scrollTop; document.documentElement.scrollLeft;
表單驗證
數(shù)據(jù)有效性郎仆，安全性驗證 3層
- 客戶端 js腳本驗證
- 服務端 java-Servlet 服務器語言
- 數(shù)據(jù)庫 數(shù)據(jù)約束只祠。
onsubmit 事件(表單提交事件)，提交表單時觸發(fā)扰肌。onsubmit會接受 true或false返回值抛寝。返回true提交當前表單，返回false 不提交表單
使用getElementById()獲取Email的值
使用字符串方法indexOf( ) 判斷Email的值是否包含“@”和“.”符號。
根據(jù)函數(shù)返回值是true還是flase來決定是否提交表單
var mail=document.getElementById("email").value;
if(mail.indexOf("@")==-1){
alert("Email格式不正確\n必須包含@");
return false;
}
使用String對象的length屬性驗證密碼的長度
var pwd=document.getElementById("pwd").value;
if(pwd.length<6){
alert("密碼必須等于或大于6個字符");
return false;
}
驗證兩次輸入密碼是否一致
var repwd=document.getElementById("repwd").value;
if(pwd!=repwd){
alert("兩次輸入的密碼不一致");
return false;
}
使用length屬性獲取文本長度盗舰，使用for循環(huán)和substring()方法依次截斷單個字符晶府，判斷每個字符是否是數(shù)字
var user=document.getElementById("user").value;
for(var i=0;i<user.length;i++){
var j=user.substring(i,i+1)
if(isNaN(j)==false){
alert("姓名中不能包含數(shù)字");
return false;
}
}
- 事件
- onblur 失去焦點，當光標離開某個文本框時觸發(fā)
- onfocus 獲得焦點钻趋，當光標進入某個文本框時觸發(fā)
- onkeypress 某個鍵盤按鍵被按下并松開
- 方法
- blur() 從文本域中移開焦點
- focus() 在文本域中設置焦點川陆，即獲得鼠標光標
- select() 選取文本域中的內容
- 屬性
id 設置或返回文本域的id
-
value 設置或返回文本域的balue屬性的值
function clearText(){ var mail=document.getElementById("email"); if(mail.value=="請輸入正確的電子郵箱"){ mail.value=""; mail.style.borderColor="#ff0000"; } } …… <td>Email：<input id="email" type="text" class="inputs" value="請輸入正確的電子郵箱" onfocus="clearText()"/></td> </tr> if(mail.indexOf("@")==-1 || mail.indexOf(".")==-1){ alert("Email格式不正確\n必須包含符號@和."); document.getElementById("email").select(); return false; } function checkEmail(){ var mail= document.getElementById ("email"); var divID= document.getElementById ("DivEmail"); divID.innerHTML=""; if(mail.value==""){ divID.innerHTML="Email不能為空"; return false; } } ……<input id="email" type="text" class="inputs" onblur="checkEmail()"/>
<div class="red" id="DivEmail"></div>
正則表達式
什么是正則表達式(regular expression):是一種字符串匹配的模式，用來檢查一個字符串中是否包含指定模式的字符串蛮位。
正則表達式的創(chuàng)建
- var reg = /white/g;
- var reg = new RegExp('white',g);
正則表達式的修飾符
g 全局匹配(默認找到第一個就完成匹配了)
i 不區(qū)分大小寫
-
m 多行匹配
var reg=/^\w+$/; var reg=/^\w+@\w+.[a-zA-Z]{2,3}(.[a-zA-Z]{2,3})?$/; var reg = new RegExp(/^\w+@\w+.[a-zA-Z]{2,3}(.[a-zA-Z]{2,3})?$/,"g"); / /正則表達式的創(chuàng)建
^ 字符串開始
$ 字符串結束
\w 任意字母和數(shù)字速兔、下劃線 1车遂、w氧急、h
- 表示前一個字符出現(xiàn){1,}一次或多次 123拐叉、wwwwhj,sb2b250
@ 普通字符串 123@ wfga@ 250sb@
\w 123@123 wgad@gas g23@123a
[A-Za-z] 123@163.c
{2,3} 123@163.com
(.[a-zA-Z]{2,3})? 123@163.com.cn
-
構造函數(shù) var reg=new RegExp("表達式","附加參數(shù)")
var reg=new RegExp("white"); var reg=new RegExp("white","g"); var str=”black white” alert(str.search(reg))
string對象的方法
- match 找到一個或多個正則表達式的匹配
- search 檢索與正則表達式相匹配的值
- replace 替換與正則表達式匹配的字符串
- split 把字符串分割為字符串數(shù)組
正則表達式符號
-
修飾符
- i 執(zhí)行對大小寫不敏感的匹配
- g 執(zhí)行全局匹配(查找所有匹配而非在找到第一個匹配后停止)
- m 執(zhí)行多行匹配
-
方括號用于查找某個范圍內的字符：
- [abc] 查找方括號之間的任何字符
- [^abc] 查找任何不在方括號之間的字符
- [0-9] 查找任何從0到9的數(shù)字
- [a-z] 查找任何從小寫a到小寫z的字符
- [A-Z] 查找任何從大寫A到大寫Z的字符
- [A-z] 查找任何從大寫A到小寫z的字符
- [adgk] 查找給定集合內的任何字符
- [^adgk] 查找給定集合外的任何字符
- (red|blue|green) 查找任何指定的選項
-
元字符(Metacharacter)是擁有特殊含義的字符：
- /../ 代表一個模式的開始和結束
- ^ 匹配字符串的開始
- $ 匹配字符串的結束
- \s 任何空白字符
- \S 任何非空白字符
- \d 匹配一個數(shù)字字符，等價于[0-9]
- \D 除了數(shù)字之外的任何字符萄焦，等價于[^0-9]
- \w 匹配一個數(shù)字控轿、下劃線或字母字符，等價于[A-Za-z0-9]
- \W 任何非單字字符楷扬，等價于[^A-Za-z0-9]
- . 除了換行符之外的任意字符
-
正則表達式重復字符(量詞)
{n} 匹配前一項n次
{n,} 匹配前一項n次解幽，或者多次
{n,m} 匹配前一項至少n次，但是不能超過m次
- 匹配前一項0次或多次烘苹，等價于{0，}
- 匹配前一項1次或多次片部，等價于{1镣衡，}
-
？匹配前一項0次或1次档悠，也就是說前一項是可選的廊鸥，等價于{0,1}
年齡0-120的正則表達式 /^120$|^((1[0-1]|[1-9])?\d)$/m 用戶名正則：/^[a-zA-Z][a-zA-Z0-9]{3,15}$/ 密碼正則：/^[a-zA-Z0-9]{4,10}$/ 生日正則：/^((19\d{2})|(200\d))-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])$/ Email正則：/^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/ 最新身份證正則：/^\d{15}$|^\d{17}([0-9]|X)$/
RegExp對象的屬性
- global RegExp對象是否具有標志g，它聲明了給定的正則表達式是否執(zhí)行全局匹配
- ignoreCase RegExp對象是否具有標志i辖所，它聲明了給定的正則表達式是否執(zhí)行對大小寫不敏感的匹配
- multilne RegExp對象是否具有標志m惰说，它聲明了給定的正則表達式是否執(zhí)行多行匹配
RegExp對象的方法
- exec() 檢索字符中是正則表達式的匹配，返回找到的值缘回，并確定其位置,如果沒有發(fā)現(xiàn)匹配吆视，則返回null
- test() 檢索字符串中指定的值，返回true或false
select 對象常用時間酥宴、方法和屬性
- 事件 onchange 當改變選項時調用的事件
- 方法 add() 向下拉列表中添加一個選項
- 屬性 options[] 返回包含下拉列表中的所有選項的一個數(shù)組
- selectedIndex 設置或返回下拉列表中被選項目的索引號
- length 返回下拉列表中的選項的數(shù)目
Option對象常用屬性
text：設置或返回某個選項的純文本值
-
value：設置或返回被送往服務器的值
function get(){ var index=document.getElementById("fruit").selectedIndex; var len=document.getElementById("fruit").length; var show=document.getElementById("show"); show.innerHTML="被選選項的索引號為："+index+"<br/>下拉列表選項數(shù)目為："+len; }
var cityList = new Array();
cityList['河北省']={'石家莊市':['裕華區(qū)','藁城區(qū)'],'衡水市':['桃城區(qū)','棗強縣']};
cityList['河南省']={'鄭州市':['中原區(qū)','二七區(qū)'],'洛陽市':['老城區(qū)','西工區(qū)']};
function setProv(){
var p = document.getElementById('prov');
for(var prov in cityList){
p.add(new Option(prov,prov,null));
}
get();
}
function get(){
var p = document.getElementById('prov');
var pv = p.value;
var c = document.getElementById('city');
c.options.length=0;
var cs = cityList[pv];
for(var city in cs){
c.add(new Option(city,city,null));
}
gets();
}
function gets(){
var p = document.getElementById('prov');//選中的省份
var pv = p.value;//選中項的值
var c = document.getElementById('city');
var cv = c.value;//城市數(shù)組的值
var cs = cityList[pv];//省份對應城市的數(shù)組
var q = document.getElementById('qu');//獲取曲線下拉框元素對象
var qs = cs[cv];//曲線數(shù)組
q.options.length = 0;//q.options-獲取下拉框的選項數(shù)組啦吧，length=0清空數(shù)組
for(var qu in qs){
q.add(new Option(qs[qu],qs[qu],null))
}
}
window.onload = setProv;
Math對象
Math對象包含的屬性大部分是數(shù)學計算中可能會用倒的一些特殊值：
Math.E 自然對數(shù)的底數(shù)，常量e
Math.LN10 10的自然對數(shù)
Math.LN2 2的自然對數(shù)
Math.LOG2E 以2為底e的自然對數(shù)
Math.LOG10E 以10為底的自然對數(shù)
Math.PI π
Math.SQRT1_2 1/2的平方根
Math.SQRT2 2的平方根
-
向上舍入小數(shù)點拙寡，它將數(shù)值向上舍入為最接近的整數(shù)
- Math.ceil()
-
向下舍入小數(shù)點授滓，它將數(shù)值向下舍入為最接近的整數(shù)
- Math.floor()
-
標準的四舍五入，它將數(shù)值四舍五入為最接近的整數(shù)
- Math.round()
-
獲取最大值的語法格式
- Math.max(num1,num2,...)
-
獲取最小值的語法格式
- Math.min(num1,num2,...)
設一個數(shù)字變量，當這一變量大于500的時候般堆，讓這個變量的值等于500在孝；
實現(xiàn)1：if ( num > 500 ) { num = 500；}
實現(xiàn)2：num = Math.min( num ,500 )淮摔；
-
隨機函數(shù)語法私沮，返回介于0-1之間的隨機小數(shù)，不包括0和1
- Math.random()
- 值 = Math.floor ( Math.random ( ) * 可能值的總數(shù)+ 第一個可能的值 )
-
正選三角函數(shù)噩咪，獲取x的正弦值（x為弧度制）
- Math.sin（x） 取值范圍：-1<=y<=1
-
反正弦三角函數(shù) 顾彰，獲取num的反正弦值
-
Math.asin（num）
Math.sin（ Math.PI / 2）= 1 Math.asin（1）≈ 1.570796…
-
-
余弦三角函數(shù)，獲取x的余弦值（x為弧度制）
- Math.cos（x） 取值范圍：-1<=y<=1
-
反余弦三角函數(shù) 胃碾，獲取num的反余弦值
-
Math.acos（num）
Math.cos（ Math.PI / 2）= 0 Math.acos（1）= 0
-
-
角度與弧度轉換公式：
- 弧度值 = 角度值 * π / 180
把發(fā)生連續(xù)上下變化的Y值涨享，賦給CSS樣式中的______________屬性？
即 ： marginTop=sin ( x )仆百； x 為不斷增加的變量
實現(xiàn)一個div的左右運動效果 改變 marginLeft 屬性 left屬性也可以厕隧，如果使用left屬性，需要絕對定位
Math其它常用函數(shù)
Math.abs(num) 返回num的絕對值
Math.exp(num) 返回Math.E的num次冪
Math.log(num) 返回num的自然對數(shù)
Math.pow(num,power) 返回num的power次冪
Math.sqrt(num) 返回num的平方根
Math.atan(x) 返回x的反正切值
Math.atan2(y,x) 返回y/x的反正切值
Math.tan(x) 返回弧度x的正切值
Date對象
獲取當前時間
getHours 獲取當前小時數(shù)
getMinutes 獲取當前分鐘數(shù)
getSeconds 獲取當前秒數(shù)
var dates = new Date();
var hour = dates.getHours();
獲取其它時間的方法
getFullYear();獲取4位數(shù)的年份
getMonth();獲取月份俄周，從0開始吁讨，0表示1月
getDate();獲取月份中的天數(shù)
getDay();獲取是周幾，從0開始
getMilliseconds();獲取當前的毫秒數(shù)
getTime();獲取從1970年1月1日到現(xiàn)在的毫秒數(shù)
- 計算函數(shù)運行時間
- 1峦朗、函數(shù)執(zhí)行前獲取時間（startTime）建丧、函數(shù)執(zhí)行完獲取時間（endTime）
- 2、endTime – startTime =函數(shù)運行時間
獲取UTC時區(qū)的時間
getUTCFullYear();獲取UTC日期的4位數(shù)年份
getUTCMonth();獲取UTC日期月份波势，從0開始
getUTCDate();獲取UTC日期月份中的天數(shù)
getUTCDay();獲取UTC日期的周幾翎朱，從0開始
getUTCHours();獲取UTC日期的小時數(shù)，0-23
getUTCMinutes();獲取UTC日期的分鐘數(shù)尺铣，0-59
getUTCSeconds();獲取UTC日期的秒數(shù)拴曲，0-59
getUTCMilliseconds();獲取UTC日期的毫秒數(shù)
設置時間
- new Date(time); time為從1970年1月1日至設置時間的毫秒數(shù)
- new Date(‘May 25 , 2004’);
- new Date(2011,1,1); 2011年2月1日
設置當前時區(qū)的時間
setFullYear();設置4位數(shù)的年份
setMonth();設置月份，從0開始凛忿，0表示1月
setDate();設置月份中的天數(shù)
setDay();設置是周幾澈灼，從0開始
setHours();設置當前的小時數(shù)，0-23
setMinutes();設置當前的分鐘數(shù)店溢，0-59
setSeconds();設置當前的秒數(shù)叁熔，0-59
setMilliseconds();設置當前的毫秒數(shù)
setTime();設置從1970年1月1日到現(xiàn)在的毫秒數(shù)
設置UTC時區(qū)的時間
setUTCFullYear();設置UTC日期的4位數(shù)年份
setUTCMonth();設置UTC日期月份，從0開始
setUTCDate();設置UTC日期月份中的天數(shù)
setUTCDay();設置UTC日期的周幾逞怨，從0開始
setUTCHours();設置UTC日期的小時數(shù)者疤，0-23
setUTCMinutes();設置UTC日期的分鐘數(shù)，0-59
setUTCSeconds();設置UTC日期的秒數(shù)叠赦，0-59
setUTCMilliseconds();設置UTC日期的毫秒數(shù)
定時函數(shù)
-
setTimeout()用法
- setTimeout（"調用的函數(shù)", "指定的時間后"）
-
setInterval()方法
-
setInterval（"調用的函數(shù)", "指定的時間間隔"）
var myTime＝setTimeout("disptime( ) ", 1000 ); 1秒(1000毫秒)后執(zhí)行函數(shù)disptime()一次 var myTime＝setInterval("disptime( ) ", 1000 ); 每隔1秒(1000毫秒)執(zhí)行函數(shù)disptime()一次
-
setTimeout()只執(zhí)行disptime()一次驹马，如果要多次調用使用setInterval()或者讓disptime()自身再次調用setTimeout()
JS特效
事件綁定方法
找到要添加事件的標簽
為相應標簽添加鼠標事件
事件中調用函數(shù)
在js中定義相應函數(shù)
tab切換：主要就是控制對象的隱藏和顯示
無縫滾動：實現(xiàn)屬性值的設置
碰壁反彈：主要就是處理邊界值
定時函數(shù)
setTimeout()用法：只執(zhí)行一次
setInterval()方法：沒過一定時間執(zhí)行一次
偏移量的獲取
clientX鼠標移動量
offsetLeft自身絕對定位的left值
offsetWidth自身的寬
scrollLeft獲取位于對象左邊界和窗口中目前可見內容的最左端之間的距離
clientWidth瀏覽器中可見內容的寬度革砸，不包括滾動條等邊線，會隨窗口的顯示大小改變