JavaScript常用API

標籤：多個   浮點   hasclass   rto   dmi   四捨五入   range   for   sqrt   

一、節點

1.1 節點屬性

 

1.2 操作

 

1.3 Document節點

1.3.1 Document節點的屬性

1.3.2 Document節點的方法

（1）讀寫方法

（2）尋找節點

 

（3）產生節點

（4）事件方法

（5）其他

1.4 Element節點

1.4.1 Element節點的屬性

（1）特性屬性

 

（2）尺寸屬性

（3）節點相關屬性

 

1.4.2 Element節點的方法

（1）位置方法

（2）屬性方法·

（3）尋找方法

Element.querySelector()  Element.querySelectorAll()  Element.getElementsByTagName()  Element.getElementsByClassName()

（4）事件方法

Element.addEventListener()：添加事件的回呼函數  Element.removeEventListener()：移除事件監聽函數  Element.dispatchEvent()：觸發事件

//ie8
Element.attachEvent(oneventName,listener)Element.detachEvent(oneventName,listener)

// event對象 
 var event = window.event||event;    // 事件的目標節點  
 var target = event.target || event.srcElement;
 
// 事件代理  
 ul.addEventListener(‘click‘, function(event) {     if (event.target.tagName.toLowerCase() === ‘li‘) {       console.log(event.target.innerHTML)     }  });

（5）其他

Element.scrollIntoView()   //滾動當前元素，進入瀏覽器的可見地區

//解析HTML字串，然後將產生的節點插入DOM樹的指定位置。
Element.insertAdjacentHTML(where, htmlString); Element.insertAdjacentHTML(‘beforeBegin‘, htmlString); // 在該元素前插入  
Element.insertAdjacentHTML(‘afterBegin‘, htmlString); // 在該元素第一個子項目前插入 
Element.insertAdjacentHTML(‘beforeEnd‘, htmlString); // 在該元素最後一個子項目後面插入 
Element.insertAdjacentHTML(‘afterEnd‘, htmlString); // 在該元素後插入
Element.remove()  //用於將當前元素節點從DOM中移除
Element.focus()   //用於將當前頁面的焦點，轉移到指定元素上

二、CSS操作

（1）類名操作

//ie8以下
Element.className  //擷取元素節點的類名
Element.className += ‘ ‘ + newClassName  //新增一個類名

//判斷是否有某個類名
function hasClass(element,className){  return new RegExp(className,‘gi‘).test(element.className);}

//移除class
function removeClass(element,className){  element.className = element.className.replace(new RegExp(‘(^|\\b)‘ + className.split(‘ ‘).join(‘|‘) + ‘(\\b|$)‘, ‘gi‘),‘‘);}
//ie10 
element.classList.add(className)  //新增
element.classList.remove(className)  //刪除
element.classList.contains(className)  //是否包含
element.classList.toggle(className)  //toggle class

（2）style操作

element.setAttribute(‘style‘,‘‘)element.style.backgroundColor = ‘red‘element.style.cssText //用來讀寫或刪除整個style屬性element.style.setProperty(propertyName,value)  //設定css屬性element.style.getPropertyValue(property)  //擷取css屬性element.style.removeProperty(property)  //刪除css屬性操作非內聯樣式//ie8element.currentStyle[attrName]

//ie9+
window.getComputedStyle(el,null)[attrName] window.getComputedStyle(el,null).getPropertyValue(attrName)

//偽類
window.getComputedStyle(el,‘:after‘)[attrName]

三、對象

3.1 Object對象

（1）產生執行個體對象

var o = new Object()

（2）屬性

Object.prototype   //返回原型對象

（3）方法

Object.keys(o)   //遍曆對象的可枚舉屬性
Object.getOwnPropertyName(o)   //遍曆對象不可枚舉的屬性

對象執行個體的方法

valueOf()：返回當前對象對應的值。  toString()：返回當前對象對應的字串形式。  toLocaleString()：返回當前對象對應的本地字串形式。  hasOwnProperty()：判斷某個屬性是否為當前對象自身的屬性，還是繼承自原型對象的屬性。 isPrototypeOf()：判斷當前對象是否為另一個對象的原型。propertyIsEnumerable()：判斷某個屬性是否可枚舉。

3.2 Array對象

（1）產生執行個體對象

var a = new Array()

（2）屬性

a.length  //長度

（3）Array.isArray()

Array.isArray(a)   //用來判斷一個值是否為數組

（4）Array執行個體的方法

3.3 Number對象

（1）產生對象

var n = new Number()

（2）Number對象的屬性

Number.POSITIVE_INFINITY：正的無限，指向Infinity。  Number.NEGATIVE_INFINITY：負的無限，指向-Infinity。  Number.NaN：表示非數值，指向NaN。  Number.MAX_VALUE：表示最大的正數，相應的，最小的負數為-Number.MAX_VALUE。  Number.MIN_VALUE：表示最小的正數（即最接近0的正數，在64位浮點數體系中為5e-324），相應的，最接近0的負數為-Number.MIN_VALUE。  Number.MAX_SAFE_INTEGER：表示能夠精確表示的最大整數，即9007199254740991。  Number.MIN_SAFE_INTEGER：表示能夠精確表示的最小整數，即-9007199254740991。

（4）Number對象執行個體的方法

toString()   //用來將一個數值轉為字串形式.可以接受一個參數，表示輸出的進位。如果省略這個參數，預設將數值先轉為十進位，再輸出字串；否則，就根據參數指定的進位，將一個數字轉化成某個進位的字串。
toFixed()   //用於將一個數轉為指定位元的小數，返回這個小數對應的字串。
toExponential()  //用於將一個數轉為科學計數法形式。可傳入一個參數，參數表示小數點後有效數位位元，範圍為0到20，超出這個範圍，會拋出一個RangeError。
toPrecision()  //用於將一個數轉為指定位元的有效數字。

3.4 String 對象

（1）產生執行個體對象

var s = new String()

（2）String對象的屬性

s.length   //返回字串的長度

（3）方法

3.5 Math對象

（1）屬性

Math.E：常數e。  Math.LN2：2的自然對數。  Math.LN10：10的自然對數。  Math.LOG2E：以2為底的e的對數。  Math.LOG10E：以10為底的e的對數。  Math.PI：常數Pi。  Math.SQRT1_2：0.5的平方根。  Math.SQRT2：2的平方根。

（2）數學方法

Math.abs()：返回參數的絕對值  Math.ceil()：向上取整，接受一個參數，返回大於該參數的最小整數。 Math.floor()：向下取整  Math.max(n,n1,...)：可接受多個參數，返回最大值  Math.min(n,n1,..)：可接受多個參數，返回最小值  Math.pow(n,e)：指數運算, 返回以第一個參數為底數、第二個參數為冪的指數值。 Math.sqrt()：返回參數值的平方根。如果參數是一個負值，則返回NaN。  Math.log()：返回以e為底的自然對數值。Math.exp()：返回e的指數，也就是常數e的參數次方。Math.round()：四捨五入  Math.random()：返回0到1之間的一個偽隨機數，可能等於0，但是一定小於1。

（3）三角函數方法

Math.sin()：返回參數的正弦  Math.cos()：返回參數的餘弦  Math.tan()：返回參數的正切  Math.asin()：返回參數的反正弦（弧度值）  Math.acos()：返回參數的反餘弦（弧度值）  Math.atan()：返回參數的反正切（弧度值）

3.6 JSON對象

（1）方法

JSON.stringify()   //用於將一個值轉為字串。該字串應該符合JSON格式，並且可以被JSON.parse方法還原。
//（JSON.stringify(obj, selectedProperties)）還可以接受一個數組，作為第二個參數，指定需要轉成字串的屬性。
//還可以接受第三個參數，用於增加返回的JSON字串的可讀性。如果是數字，表示每個屬性前面添加的空格（最多不超過10個）；如果是字串（不超過10個字元），則該字串會添加在每行前面。
JSON.parse()   //用於將JSON字串轉化成對象。

3.7 console對象

（1）方法

JavaScript常用API