JavaScript學習筆記整理(16):常用API合集

2018-06-19 13:59 更新
      下面是我整理的JavaScript常用的API合集。

一、節(jié)點

1.1 節(jié)點屬性

Node.nodeName   //返回節(jié)點名稱,只讀

Node.nodeType   //返回節(jié)點類型的常數(shù)值,只讀

Node.nodeValue  //返回Text或Comment節(jié)點的文本值,只讀

Node.textContent  //返回當前節(jié)點和它的所有后代節(jié)點的文本內(nèi)容,可讀寫

Node.baseURI    //返回當前網(wǎng)頁的絕對路徑


Node.ownerDocument  //返回當前節(jié)點所在的頂層文檔對象,即document

Node.nextSibling  //返回緊跟在當前節(jié)點后面的第一個兄弟節(jié)點

Node.previousSibling  //返回當前節(jié)點前面的、距離最近的一個兄弟節(jié)點

Node.parentNode   //返回當前節(jié)點的父節(jié)點

Node.parentElement  //返回當前節(jié)點的父Element節(jié)點

Node.childNodes   //返回當前節(jié)點的所有子節(jié)點

Node.firstChild  //返回當前節(jié)點的第一個子節(jié)點

Node.lastChild   //返回當前節(jié)點的最后一個子節(jié)點


//parentNode接口

Node.children  //返回指定節(jié)點的所有Element子節(jié)點

Node.firstElementChild  //返回當前節(jié)點的第一個Element子節(jié)點

Node.lastElementChild   //返回當前節(jié)點的最后一個Element子節(jié)點

Node.childElementCount  //返回當前節(jié)點所有Element子節(jié)點的數(shù)目。


1.2 操作

Node.appendChild(node)   //向節(jié)點添加最后一個子節(jié)點

Node.hasChildNodes()   //返回布爾值,表示當前節(jié)點是否有子節(jié)點

Node.cloneNode(true);  // 默認為false(克隆節(jié)點), true(克隆節(jié)點及其屬性,以及后代)

Node.insertBefore(newNode,oldNode)  // 在指定子節(jié)點之前插入新的子節(jié)點

Node.removeChild(node)   //刪除節(jié)點,在要刪除節(jié)點的父節(jié)點上操作

Node.replaceChild(newChild,oldChild)  //替換節(jié)點

Node.contains(node)  //返回一個布爾值,表示參數(shù)節(jié)點是否為當前節(jié)點的后代節(jié)點。

Node.compareDocumentPosition(node)   //返回一個7個比特位的二進制值,表示參數(shù)節(jié)點和當前節(jié)點的關(guān)系

Node.isEqualNode(noe)  //返回布爾值,用于檢查兩個節(jié)點是否相等。所謂相等的節(jié)點,指的是兩個節(jié)點的類型相同、屬性相同、子節(jié)點相同。

Node.normalize()   //用于清理當前節(jié)點內(nèi)部的所有Text節(jié)點。它會去除空的文本節(jié)點,并且將毗鄰的文本節(jié)點合并成一個。


//ChildNode接口

Node.remove()  //用于刪除當前節(jié)點

Node.before()  //

Node.after()

Node.replaceWith()


1.3 Document節(jié)點

1.3.1 Document節(jié)點的屬性

document.doctype   //

document.documentElement  //返回當前文檔的根節(jié)點

document.defaultView   //返回document對象所在的window對象

document.body   //返回當前文檔的<body>節(jié)點

document.head   //返回當前文檔的<head>節(jié)點

document.activeElement  //返回當前文檔中獲得焦點的那個元素。


//節(jié)點集合屬性

document.links  //返回當前文檔的所有a元素

document.forms  //返回頁面中所有表單元素

document.images  //返回頁面中所有圖片元素

document.embeds  //返回網(wǎng)頁中所有嵌入對象

document.scripts  //返回當前文檔的所有腳本

document.styleSheets  //返回當前網(wǎng)頁的所有樣式表


//文檔信息屬性

document.documentURI  //表示當前文檔的網(wǎng)址

document.URL  //返回當前文檔的網(wǎng)址

document.domain  //返回當前文檔的域名

document.lastModified  //返回當前文檔最后修改的時間戳

document.location  //返回location對象,提供當前文檔的URL信息

document.referrer  //返回當前文檔的訪問來源

document.title    //返回當前文檔的標題

document.characterSet屬性返回渲染當前文檔的字符集,比如UTF-8、ISO-8859-1。

document.readyState  //返回當前文檔的狀態(tài)

document.designMode  //控制當前文檔是否可編輯,可讀寫

document.compatMode  //返回瀏覽器處理文檔的模式

document.cookie   //用來操作Cookie


1.3.2 Document節(jié)點的方法
(1)讀寫方法

document.open()   //用于新建并打開一個文檔

document.close()   //不安比open方法所新建的文檔

document.write()   //用于向當前文檔寫入內(nèi)容

document.writeIn()  //用于向當前文檔寫入內(nèi)容,尾部添加換行符。

(2)查找節(jié)點

document.querySelector(selectors)   //接受一個CSS選擇器作為參數(shù),返回第一個匹配該選擇器的元素節(jié)點。

document.querySelectorAll(selectors)  //接受一個CSS選擇器作為參數(shù),返回所有匹配該選擇器的元素節(jié)點。

document.getElementsByTagName(tagName)  //返回所有指定HTML標簽的元素

document.getElementsByClassName(className)   //返回包括了所有class名字符合指定條件的元素

document.getElementsByName(name)   //用于選擇擁有name屬性的HTML元素(比如<form>、<radio>、<img>、<frame>、<embed>和<object>等)

document.getElementById(id)   //返回匹配指定id屬性的元素節(jié)點。

document.elementFromPoint(x,y)  //返回位于頁面指定位置最上層的Element子節(jié)點。

(3)生成節(jié)點

document.createElement(tagName)   //用來生成HTML元素節(jié)點。

document.createTextNode(text)   //用來生成文本節(jié)點

document.createAttribute(name)  //生成一個新的屬性對象節(jié)點,并返回它。

document.createDocumentFragment()  //生成一個DocumentFragment對象

(4)事件方法

document.createEvent(type)   //生成一個事件對象,該對象能被element.dispatchEvent()方法使用

document.addEventListener(type,listener,capture)  //注冊事件

document.removeEventListener(type,listener,capture)  //注銷事件

document.dispatchEvent(event)  //觸發(fā)事件


(5)其他

document.hasFocus()   //返回一個布爾值,表示當前文檔之中是否有元素被激活或獲得焦點。

document.adoptNode(externalNode)  //將某個節(jié)點,從其原來所在的文檔移除,插入當前文檔,并返回插入后的新節(jié)點。

document.importNode(externalNode, deep)   //從外部文檔拷貝指定節(jié)點,插入當前文檔。


1.4 Element節(jié)點

1.4.1 Element節(jié)點的屬性
(1)特性屬性

Element.attributes  //返回當前元素節(jié)點的所有屬性節(jié)點

Element.id  //返回指定元素的id屬性,可讀寫

Element.tagName  //返回指定元素的大寫標簽名

Element.innerHTML   //返回該元素包含的HTML代碼,可讀寫

Element.outerHTML  //返回指定元素節(jié)點的所有HTML代碼,包括它自身和包含的的所有子元素,可讀寫

Element.className  //返回當前元素的class屬性,可讀寫

Element.classList  //返回當前元素節(jié)點的所有class集合

Element.dataset   //返回元素節(jié)點中所有的data-*屬性。

(2)尺寸屬性

Element.clientHeight   //返回元素節(jié)點可見部分的高度

Element.clientWidth   //返回元素節(jié)點可見部分的寬度

Element.clientLeft   //返回元素節(jié)點左邊框的寬度

Element.clientTop   //返回元素節(jié)點頂部邊框的寬度

Element.scrollHeight  //返回元素節(jié)點的總高度

Element.scrollWidth  //返回元素節(jié)點的總寬度

Element.scrollLeft   //返回元素節(jié)點的水平滾動條向右滾動的像素數(shù)值,通過設(shè)置這個屬性可以改變元素的滾動位置

Element.scrollTop   //返回元素節(jié)點的垂直滾動向下滾動的像素數(shù)值

Element.offsetHeight   //返回元素的垂直高度(包含border,padding)

Element.offsetWidth    //返回元素的水平寬度(包含border,padding)

Element.offsetLeft    //返回當前元素左上角相對于Element.offsetParent節(jié)點的垂直偏移

Element.offsetTop   //返回水平位移

Element.style  //返回元素節(jié)點的行內(nèi)樣式

(3)節(jié)點相關(guān)屬性

Element.children   //包括當前元素節(jié)點的所有子元素

Element.childElementCount   //返回當前元素節(jié)點包含的子HTML元素節(jié)點的個數(shù)

Element.firstElementChild //返回當前節(jié)點的第一個Element子節(jié)點  

Element.lastElementChild //返回當前節(jié)點的最后一個Element子節(jié)點  

Element.nextElementSibling  //返回當前元素節(jié)點的下一個兄弟HTML元素節(jié)點

Element.previousElementSibling  //返回當前元素節(jié)點的前一個兄弟HTML節(jié)點

Element.offsetParent   //返回當前元素節(jié)點的最靠近的、并且CSS的position屬性不等于static的父元素。


1.4.2 Element節(jié)點的方法
(1)位置方法

getBoundingClientRect()  

// getBoundingClientRect返回一個對象,包含top,left,right,bottom,width,height // width、height 元素自身寬高

// top 元素上外邊界距窗口最上面的距離

// right 元素右外邊界距窗口最上面的距離

// bottom 元素下外邊界距窗口最上面的距離

// left 元素左外邊界距窗口最上面的距離

// width 元素自身寬(包含border,padding) 

// height 元素自身高(包含border,padding) 


getClientRects()   //返回當前元素在頁面上形參的所有矩形。


// 元素在頁面上的偏移量  

var rect = el.getBoundingClientRect()  

return {   

  top: rect.top + document.body.scrollTop,   

  left: rect.left + document.body.scrollLeft  

}

(2)屬性方法

Element.getAttribute():讀取指定屬性  

Element.setAttribute():設(shè)置指定屬性  

Element.hasAttribute():返回一個布爾值,表示當前元素節(jié)點是否有指定的屬性  

Element.removeAttribute():移除指定屬性

(3)查找方法

Element.querySelector()  

Element.querySelectorAll()  

Element.getElementsByTagName()  

Element.getElementsByClassName()

(4)事件方法

Element.addEventListener():添加事件的回調(diào)函數(shù)  

Element.removeEventListener():移除事件監(jiān)聽函數(shù)  

Element.dispatchEvent():觸發(fā)事件


//ie8

Element.attachEvent(oneventName,listener)

Element.detachEvent(oneventName,listener)


// event對象  

var event = window.event||event;    


// 事件的目標節(jié)點  

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()   //滾動當前元素,進入瀏覽器的可見區(qū)域


//解析HTML字符串,然后將生成的節(jié)點插入DOM樹的指定位置。

Element.insertAdjacentHTML(where, htmlString); 

Element.insertAdjacentHTML('beforeBegin', htmlString); // 在該元素前插入  

Element.insertAdjacentHTML('afterBegin', htmlString); // 在該元素第一個子元素前插入 

Element.insertAdjacentHTML('beforeEnd', htmlString); // 在該元素最后一個子元素后面插入 

Element.insertAdjacentHTML('afterEnd', htmlString); // 在該元素后插入


Element.remove()  //用于將當前元素節(jié)點從DOM中移除

Element.focus()   //用于將當前頁面的焦點,轉(zhuǎn)移到指定元素上

更多節(jié)點細節(jié):JavaScript學習筆記整理(8):DOM

二、CSS操作

(1)類名操作

//ie8以下

Element.className  //獲取元素節(jié)點的類名

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)  //設(shè)置css屬性

element.style.getPropertyValue(property)  //獲取css屬性

element.style.removeProperty(property)  //刪除css屬性

操作非內(nèi)聯(lián)樣式

//ie8

element.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)   //用來判斷一個值是否為數(shù)組

(4)Array實例的方法

a.valueof()   //返回數(shù)組本身

a.toString()  //返回數(shù)組的字符串形式

a.push(value,vlaue....)   //用于在數(shù)組的末端添加一個或多個元素,并返回添加新元素后的數(shù)組長度。

pop()   //用于刪除數(shù)組的最后一個元素,并返回該元素

join()  //以參數(shù)作為分隔符,將所有數(shù)組成員組成一個字符串返回。如果不提供參數(shù),默認用逗號分隔。

concat()  //用于多個數(shù)組的合并。它將新數(shù)組的成員,添加到原數(shù)組的尾部,然后返回一個新數(shù)組,原數(shù)組不變。

shift()  //用于刪除數(shù)組的第一個元素,并返回該元素。

unshift(value)  //用于在數(shù)組的第一個位置添加元素,并返回添加新元素后的數(shù)組長度。

reverse()   //用于顛倒數(shù)組中元素的順序,返回改變后的數(shù)組

slice(start_index, upto_index);   //用于提取原數(shù)組的一部分,返回一個新數(shù)組,原數(shù)組不變。第一個參數(shù)為起始位置(從0開始),第二個參數(shù)為終止位置(但該位置的元素本身不包括在內(nèi))。如果省略第二個參數(shù),則一直返回到原數(shù)組的最后一個成員。負數(shù)表示倒數(shù)第幾個。

splice(index, count_to_remove, addElement1, addElement2, ...);   //用于刪除原數(shù)組的一部分成員,并可以在被刪除的位置添加入新的數(shù)組成員,返回值是被刪除的元素。第一個參數(shù)是刪除的起始位置,第二個參數(shù)是被刪除的元素個數(shù)。如果后面還有更多的參數(shù),則表示這些就是要被插入數(shù)組的新元素。

sort()   //對數(shù)組成員進行排序,默認是按照字典順序排序。排序后,原數(shù)組將被改變。如果想讓sort方法按照自定義方式排序,可以傳入一個函數(shù)作為參數(shù),表示按照自定義方法進行排序。該函數(shù)本身又接受兩個參數(shù),表示進行比較的兩個元素。如果返回值大于0,表示第一個元素排在第二個元素后面;其他情況下,都是第一個元素排在第二個元素前面。

map()   //對數(shù)組的所有成員依次調(diào)用一個函數(shù),根據(jù)函數(shù)結(jié)果返回一個新數(shù)組。

map(elem,index,arr)   //map方法接受一個函數(shù)作為參數(shù)。該函數(shù)調(diào)用時,map方法會將其傳入三個參數(shù),分別是當前成員、當前位置和數(shù)組本身。

forEach()   //遍歷數(shù)組的所有成員,執(zhí)行某種操作,參數(shù)是一個函數(shù)。它接受三個參數(shù),分別是當前位置的值、當前位置的編號和整個數(shù)組。

filter()   //參數(shù)是一個函數(shù),所有數(shù)組成員依次執(zhí)行該函數(shù),返回結(jié)果為true的成員組成一個新數(shù)組返回。該方法不會改變原數(shù)組。

some()    //用來判斷數(shù)組成員是否符合某種條件。接受一個函數(shù)作為參數(shù),所有數(shù)組成員依次執(zhí)行該函數(shù),返回一個布爾值。該函數(shù)接受三個參數(shù),依次是當前位置的成員、當前位置的序號和整個數(shù)組。只要有一個數(shù)組成員的返回值是true,則整個some方法的返回值就是true,否則false。

every()   //用來判斷數(shù)組成員是否符合某種條件。接受一個函數(shù)作為參數(shù),所有數(shù)組成員依次執(zhí)行該函數(shù),返回一個布爾值。該函數(shù)接受三個參數(shù),依次是當前位置的成員、當前位置的序號和整個數(shù)組。所有數(shù)組成員的返回值都是true,才返回true,否則false。

reduce()   //依次處理數(shù)組的每個成員,最終累計為一個值。從左到右處理(從第一個成員到最后一個成員)

reduceRight()  //依次處理數(shù)組的每個成員,最終累計為一個值。從右到左(從最后一個成員到第一個成員)

indexOf(s)   //返回給定元素在數(shù)組中第一次出現(xiàn)的位置,如果沒有出現(xiàn)則返回-1。可以接受第二個參數(shù),表示搜索的開始位置

lastIndexOf()  //返回給定元素在數(shù)組中最后一次出現(xiàn)的位置,如果沒有出現(xiàn)則返回-1。


3.3 Number對象

(1)生成對象

var n = new Number()

(2)Number對象的屬性

Number.POSITIVE_INFINITY:正的無限,指向Infinity。  

Number.NEGATIVE_INFINITY:負的無限,指向-Infinity。  

Number.NaN:表示非數(shù)值,指向NaN。  

Number.MAX_VALUE:表示最大的正數(shù),相應的,最小的負數(shù)為-Number.MAX_VALUE。  

Number.MIN_VALUE:表示最小的正數(shù)(即最接近0的正數(shù),在64位浮點數(shù)體系中為5e-324),相應的,最接近0的負數(shù)為-Number.MIN_VALUE。  

Number.MAX_SAFE_INTEGER:表示能夠精確表示的最大整數(shù),即9007199254740991。  

Number.MIN_SAFE_INTEGER:表示能夠精確表示的最小整數(shù),即-9007199254740991。

(4)Number對象實例的方法

toString()   //用來將一個數(shù)值轉(zhuǎn)為字符串形式.可以接受一個參數(shù),表示輸出的進制。如果省略這個參數(shù),默認將數(shù)值先轉(zhuǎn)為十進制,再輸出字符串;否則,就根據(jù)參數(shù)指定的進制,將一個數(shù)字轉(zhuǎn)化成某個進制的字符串。

toFixed()   //用于將一個數(shù)轉(zhuǎn)為指定位數(shù)的小數(shù),返回這個小數(shù)對應的字符串。

toExponential()  //用于將一個數(shù)轉(zhuǎn)為科學計數(shù)法形式??蓚魅胍粋€參數(shù),參數(shù)表示小數(shù)點后有效數(shù)字的位數(shù),范圍為0到20,超出這個范圍,會拋出一個RangeError。

toPrecision()  //用于將一個數(shù)轉(zhuǎn)為指定位數(shù)的有效數(shù)字。


3.4 String 對象

(1)生成實例對象

var s = new String()

(2)String對象的屬性

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

(3)方法

s.chatAt(index)   //返回指定位置的字符

s.fromCharCode() //該方法的參數(shù)是一系列Unicode碼點,返回對應的字符串。

s.charCodeAt(index)    //返回給定位置字符的Unicode碼點(十進制表示)

s.concat(s2)  //用于連接兩個字符串

s.slice(start,end)   //用于從原字符串取出子字符串并返回,不改變原字符串。第一個參數(shù)是子字符串的開始位置,第二個參數(shù)是子字符串的結(jié)束位置(不含該位置)。如果參數(shù)是負值,表示從結(jié)尾開始倒數(shù)計算的位置,即該負值加上字符串長度。

s.substring(start,end)  //用于從原字符串取出子字符串并返回,不改變原字符串.第一個參數(shù)表示子字符串的開始位置,第二個位置表示結(jié)束位置。

s.substr(start,length)   //用于從原字符串取出子字符串并返回,不改變原字符串。第一個參數(shù)是子字符串的開始位置,第二個參數(shù)是子字符串的長度。如果第一個參數(shù)是負數(shù),表示倒數(shù)計算的字符位置。如果第二個參數(shù)是負數(shù),將被自動轉(zhuǎn)為0,因此會返回空字符串。

s.indexOf(s) //返回給定元素在字符串中第一次出現(xiàn)的位置,如果沒有出現(xiàn)則返回-1??梢越邮艿诙€參數(shù),表示搜索的開始位置 

s.lastIndexOf() //返回給定元素在字符串中最后一次出現(xiàn)的位置,如果沒有出現(xiàn)則返回-1。

s.trim()  //用于去除字符串兩端的空格,返回一個新字符串

s.toLowerCase()  //用于將一個字符串全部轉(zhuǎn)為小寫,返回一個新字符串,不改變原字符串。

s.toUpperCase()  //全部轉(zhuǎn)為大寫

s.localeCompare(s2)  //用于比較兩個字符串。它返回一個整數(shù),如果小于0,表示第一個字符串小于第二個字符串;如果等于0,表示兩者相等;如果大于0,表示第一個字符串大于第二個字符串。

s.match(regexp)   //用于確定原字符串是否匹配某個子字符串,返回一個數(shù)組,成員為匹配的第一個字符串。如果沒有找到匹配,則返回null。

s.search()  //返回值為匹配的第一個位置。如果沒有找到匹配,則返回-1。

s.replace(oldValue,newValue)  //用于替換匹配的子字符串,一般情況下只替換第一個匹配(除非使用帶有g(shù)修飾符的正則表達式)。

s.split()  //按照給定規(guī)則分割字符串,返回一個由分割出來的子字符串組成的數(shù)組。還可傳入第二個參數(shù),決定了返回數(shù)組的成員數(shù)。


3.5 Math對象

(1)屬性

Math.E:常數(shù)e。  

Math.LN2:2的自然對數(shù)。  

Math.LN10:10的自然對數(shù)。  

Math.LOG2E:以2為底的e的對數(shù)。  

Math.LOG10E:以10為底的e的對數(shù)。  

Math.PI:常數(shù)Pi。  

Math.SQRT1_2:0.5的平方根。  

Math.SQRT2:2的平方根。

(2)數(shù)學方法

Math.abs():返回參數(shù)的絕對值  

Math.ceil():向上取整,接受一個參數(shù),返回大于該參數(shù)的最小整數(shù)。 

Math.floor():向下取整  

Math.max(n,n1,...):可接受多個參數(shù),返回最大值  

Math.min(n,n1,..):可接受多個參數(shù),返回最小值  

Math.pow(n,e):指數(shù)運算, 返回以第一個參數(shù)為底數(shù)、第二個參數(shù)為冪的指數(shù)值。 

Math.sqrt():返回參數(shù)值的平方根。如果參數(shù)是一個負值,則返回NaN。  

Math.log():返回以e為底的自然對數(shù)值。

Math.exp():返回e的指數(shù),也就是常數(shù)e的參數(shù)次方。

Math.round():四舍五入  

Math.random():返回0到1之間的一個偽隨機數(shù),可能等于0,但是一定小于1。

(3)三角函數(shù)方法

Math.sin():返回參數(shù)的正弦  

Math.cos():返回參數(shù)的余弦  

Math.tan():返回參數(shù)的正切  

Math.asin():返回參數(shù)的反正弦(弧度值)  

Math.acos():返回參數(shù)的反余弦(弧度值)  

Math.atan():返回參數(shù)的反正切(弧度值)


3.6 JSON對象

(1)方法

JSON.stringify()   

//用于將一個值轉(zhuǎn)為字符串。該字符串應該符合JSON格式,并且可以被JSON.parse方法還原。

//(JSON.stringify(obj, selectedProperties))還可以接受一個數(shù)組,作為第二個參數(shù),指定需要轉(zhuǎn)成字符串的屬性。

//還可以接受第三個參數(shù),用于增加返回的JSON字符串的可讀性。如果是數(shù)字,表示每個屬性前面添加的空格(最多不超過10個);如果是字符串(不超過10個字符),則該字符串會添加在每行前面。


JSON.parse()   //用于將JSON字符串轉(zhuǎn)化成對象。


3.7 console對象

(1)方法

console.log(text,text2,...)   //用于在console窗口輸出信息。它可以接受多個參數(shù),將它們的結(jié)果連接起來輸出。如果第一個參數(shù)是格式字符串(使用了格式占位符),console.log方法將依次用后面的參數(shù)替換占位符,然后再進行輸出。

console.info()   //在console窗口輸出信息,同時,會在輸出信息的前面,加上一個藍色圖標。

console.debug()  //在console窗口輸出信息,同時,會在輸出信息的前面,加上一個藍色圖標。

console.warn()  //輸出信息時,在最前面加一個黃色三角,表示警告;

console.error()  //輸出信息時,在最前面加一個紅色的叉,表示出錯,同時會顯示錯誤發(fā)生的堆棧

console.table()  //可以將復合類型的數(shù)據(jù)轉(zhuǎn)為表格顯示。

console.count()  //用于計數(shù),輸出它被調(diào)用了多少次。

console.dir()    //用來對一個對象進行檢查(inspect),并以易于閱讀和打印的格式顯示。

console.dirxml()  //用于以目錄樹的形式,顯示DOM節(jié)點。

console.assert()  //接受兩個參數(shù),第一個參數(shù)是表達式,第二個參數(shù)是字符串。只有當?shù)谝粋€參數(shù)為false,才會輸出第二個參數(shù),否則不會有任何結(jié)果。


//這兩個方法用于計時,可以算出一個操作所花費的準確時間。

console.time()

console.timeEnd()

//time方法表示計時開始,timeEnd方法表示計時結(jié)束。它們的參數(shù)是計時器的名稱。調(diào)用timeEnd方法之后,console窗口會顯示“計時器名稱: 所耗費的時間”。


console.profile()  //用來新建一個性能測試器(profile),它的參數(shù)是性能測試器的名字。

console.profileEnd()  //用來結(jié)束正在運行的性能測試器。


console.group()

console.groupend()

//上面這兩個方法用于將顯示的信息分組。它只在輸出大量信息時有用,分在一組的信息,可以用鼠標折疊/展開。

console.groupCollapsed()  //用于將顯示的信息分組,該組的內(nèi)容,在第一次顯示時是收起的(collapsed),而不是展開的。


console.trace()  //顯示當前執(zhí)行的代碼在堆棧中的調(diào)用路徑。

console.clear()  //用于清除當前控制臺的所有輸出,將光標回置到第一行。

更多console細節(jié):JavaScript在瀏覽器上的調(diào)試技巧


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號