讀《JavaScript權威指南》筆記(五)

1.getComputedStyle()方法的返回值是一個CSSStyleDeclaration對象,它表明了應用在指定元素(或僞對象)上的全部樣式。javascript

2.clipjava

style="clip: rect(0px 100px 100px 0px);"

3.visibility和display屬性之間的差異能夠從它們對使用靜態或至關定位的元素的影響中看到。對於一個常規佈局流中的元素,設置visibility屬性爲hidden使得元素不可見,可是在文檔佈局中仍保留了它的空間。相似的元素能夠重複隱藏和顯示而不改變文檔佈局。可是,若是元素的display屬性設置爲none,在文檔佈局中再也不給它分配空間,它各邊的元素會合攏,就當它歷來不存在。例如,在建立展開和摺疊輪廓的效果時display屬性頗有用。visibility和display屬性對絕對和固定定位的元素的影響是等價的,由於這些元素都不是文檔佈局的一部分。然而,在隱藏和顯示定位元素時通常首選visibility屬性。web

4.定位和尺寸屬性值以「px」結尾,表明像素。也可使用英寸(「in」)、釐米(「cm」)、點(「pt」)和字體行高(「em」,一種當前字體行高的度量)。相對於使用上面的單位來指定絕對定位和尺寸,CSS也容許指定元素的位置和尺寸爲其容器元素的百分比。express

5.若是同時指定left、right和width,那麼width屬性將覆蓋right屬性;若是元素的高度重複限定,height屬性優先於bottom屬性。數組

6.當瀏覽器廠商實現非標準CSS屬性時,它們用將屬性名前加了一個廠商前綴。Firefox使用-moz-,Chrome使用-webkit-,而IE使用-ms-瀏覽器

7.若是<select>元素有multiple屬性,也就是Select對象的type屬性值爲「select-multiple」,那就容許用戶選取多個選項。不然,若是沒有多選屬性,那隻能選取單個選項,它的type屬性值爲「select-one」。安全

8.clientWidth和clientHeight相似offsetWidth和offsetHeight,不一樣的是它們不包含邊框大小,只包含內容和它的內邊距。同時,若是瀏覽器在內邊距和邊框之間添加了滾動條,clientWidth和clientHeight在其返回值中也不包含滾動條。注意,對於相似<i>、<code>和<span>這些內聯元素,clientWidth和clientHeight老是返回0。服務器

scrollWidth和scrollHeight是元素的內容區域加上它的內邊距再加上任何溢出內容的尺寸。當內容正好和內容區域匹配而沒有溢出時,這些屬性與clientWidth和clientHeight是相等的。但當溢出時,它們就包含溢出的內容,返回值比clientWidth和clientHeight要大。異步

9.getClientRects 和 getBoundingClientRectasync

getClientRects獲取元素佔據頁面的全部矩形區域,getClientRects 返回一個TextRectangle集合,就是TextRectangleList對象。TextRectangle對象包含了, top left bottom right width height 六個屬性。

getBoundingClientRect用於得到頁面中某個元素的相對瀏覽器視窗的位置。斷定一個元素的尺寸和位置最簡單的方法是調用它的getBoundingClientRect()方法。該方法是在IE 5中引入的,而如今當前的全部瀏覽器都實現了。它不須要參數,返回一個有left、right、top和bottom屬性的對象。left和top屬性表示元素的左上角的X和Y座標,right和bottom屬性表示元素的右下角的X和Y座標。

getClientRects 和 getBoundingClientRect都不是實時的。

10.nextSibling、previoursSibling該節點的兄弟節點中的前一個和下一個。具備相同父節點的兩個節點爲兄弟節點。

11.除「mouseenter」和「mouseleave」外的全部鼠標事件都能冒泡。focus和blur事件不會冒泡,但其餘全部表單事件均可以。scroll不會冒泡

12.beforeunload事件和unload相似,但它能提供詢問用戶是否肯定離開當前頁面的機會。

13.Document對象並不是獨立的,它是一個巨大的API中的核心對象,叫作文檔對象模型(Document Object Model,DOM),它表明和操做文檔的內容。通用的Document和Element類型與HTMLDocument和HTMLElement類型之間是有嚴格的區別的。Document類型表明一個HTML或XML文檔,Element類型表明該文檔中的一個元素。HTMLDocument和HTMLElement子類只是針對於HTML文檔和元素。

14.location.search = "?page=" +(pagenum+1); // 載入下一個頁面

15.location = "#top";  // 跳轉到文檔的頂部

16.一條JS註釋內但在IE中執行的代碼

/*@cc_on
  @if(@_jscript)
    // 該代碼位於一條JS註釋內但在IE中執行它
    alert("In IE");
  @end
  @*/

17.defer屬性使得瀏覽器延遲腳本的執行,直到文檔的載入和解析完成,並能夠操做。async屬性使得瀏覽器能夠儘快地執行腳本,而不用在下載腳本時阻塞文檔解析。若是<script>標籤同時有兩個屬性,同時支持二者的瀏覽器會聽從async屬性並忽略defer屬性。注意,延遲的腳本會按它們在文檔裏的出現順序執行。而異步腳本在它們載入後執行,這意味着它們可能會無序執行。

18.使用src屬性時,<script>和</script>標籤之間的任何內容都會忽略。若是同時指定src屬性和一個未知的類型,那這個腳本會被忽略,而且不會從指定的URL裏下載任何內容。

19.在HTML文檔裏嵌入客戶端JavaScript代碼有4種方法:

·內聯,放置在<script>和</script>標籤對之間。
·放置在由<script>標籤的src屬性指定的外部文件中。
·放置在HTML事件處理程序中,該事件處理程序由onclick或onmouseover這樣的HTML屬性值指定。
·放在一個URL裏,這個URL使用特殊的「javascript:」協議。

20.alert()方法返回undefined

21.Window對象是全部客戶端JavaScript特性和API的主要接入點

22.數組推導

let evensquares = [x*x for(x in range(0,10))if(x % 2 === 0)]
//這段代碼和下面這五行代碼等價:

let evensquares = [];
for(x in range(0,10)){
    if(x % 2 === 0)
    evensquares.push(x*x);
}
//通常來說,數組推導的語法以下:
[ expressionfor(variablein objectif(condition)]

23.解構賦值右側的數組所包含的元素沒必要和左側的變量一一對應,左側多餘的變量的賦值爲undefined,而右側多餘的值則會忽略。左側的變量列表能夠包含連續的逗號用以跳過右側對應的值。

let [x,y] = [1]; // x = 1, y = undefined
[x,y] = [1,2,3]; // x = 1, y = 2
[,x,,y] = [1,2,3,4]; // x = 2, y = 4

若是省略數組直接量中的某個值,省略的元素將被賦予undefined值:

var count = [1,,3]; // 數組有3個元素,中間的那個元素值爲undefined
var undefs = [,,];  // 數組有2個元素,都是undefined

數組直接量的語法容許有可選的結尾的逗號,故[,,]只有兩個元素而非三個。

當發生解構賦值時,右側的數組和對象中一個或多個的值就會被提取出來(解構),並賦值給左側相應的變量名。

在解構賦值中,等號右側是一個數組或對象(一個結構化的值),指定左側一個或多個變量的語法和右側的數組和對象直接量的語法保持格式一致。

當和數組配合使用時解構賦值是一種寫法簡單但又極其強大的功能,特別是在函數返回一組結果的時候解構賦值就顯得很是有用。

24.web安全

Web瀏覽器針對惡意代碼的第一條防線就是它們不支持某些功能。例如,客戶端JavaScript沒有權限來寫入或刪除客戶計算機上的任意文件或列出任意目錄。這意味着JavaScript程序不能刪除數據或植入病毒。

瀏覽器針對惡意代碼的第二條防線是在本身支持的某些功能上施加限制。如下是一些功能限制:· JavaScript程序能夠打開一個新的瀏覽器窗口,可是爲了防止廣告商濫用彈出窗口,不少瀏覽器限制了這一功能,使得只有爲了響應鼠標單擊這樣的用戶觸發事件的時候,才能使用它。· JavaScript程序能夠關閉本身打開的瀏覽器窗口,可是不容許它不通過用戶確認就關閉其餘的窗口。· HTML FileUpload元素的value屬性是隻讀的。若是能夠設置這個屬性,腳本就能設置它爲任意指望的文件名,從而致使表單上傳指定文件(好比密碼文件)的內容到服務器。·腳本不能讀取從不一樣服務器[插圖]載入的文檔的內容,除非這個就是包含該腳本的文檔。相似地,一個腳本不能在來自不一樣服務器的文檔上註冊事件監聽器。這就防止腳本竊取其餘頁面的用戶輸入(例如,組成一個密碼項的鍵盤單擊過程)。這一限制叫作同源策略(same-origin policy),下一節將更詳細地介紹它。注意,這裏並未給出全部的客戶端JavaScript的限制項,不一樣瀏覽器有不一樣的安全策略,並可能實現不一樣的API限制。部分瀏覽器可能還容許根據用戶偏好來加強或減弱限制。

相關文章
相關標籤/搜索