原创 獲取對象屬性的幾種方法getOwnPropertyNames/Object.keys()/for...in

getOwnPropertyNames 獲取對象自身的可枚舉和不可枚舉屬性,不包括屬性名爲Symbol值的屬性 var obj = {name: 'zyp', age: 18}; Object.defineProperty(obj

原创 Node對象的appendChild和append方法

這裏主要就目前本人瞭解到的關於appendChild和append方法闡述的一點點理解。這兩個方法都是在父節點的末尾添加子節點。 appendChild() var child = parent.appendChild(chi

原创 js中的valueOf和toString

valueOf和toSring兩個函數是除null和undefined兩種數據類型以外其他五種數據類型(number/string/bool/object/symbol)原型鏈上共有的函數,那麼這兩個函數主要是用來幹什麼的呢?司徒正美

原创 document.createElement和document.createDocumentFragment

這裏對我目前瞭解的DOM API createElement和createDocumentFragment進行簡單的闡述: createElement() 該方法一般帶有一個標籤名參數,用於創建nodeType=1的元素節點,如:

原创 js中的replace方法

本文主要研究字符串方法中的replace方法,該方法主要用於將字符串中符合匹配條件的字串替換成其他的字符串,返回替換後的字符串,且原字符串不變。 語法: var newStr = str.replace(regexp|substr,

原创 獲取頁面高度和寬度等

獲取頁面相關的高度 獲取網頁可見區域的高(不包括菜單欄) var clientHeight = document.documentElement.clientHeight || document.body.clientHeig

原创 字符串搜索匹配之match&&exec

這裏討論的是字符串搜索匹配時常用的另外兩個API: match exec str.match(reg) 如果傳入的參數reg不是一個正則表達式對象,而是字符串,那麼這裏會和search函數一樣通過new RegExp(str)將其隱

原创 input輸入框的事件監聽

主要涉及到的事件有:change, input,propertychange 針對IE瀏覽器(IE11測試): change事件: 輸入框內容變化且失去焦點,觸發change事件。 <input type="text"

原创 js中的事件捕獲和事件冒泡,以及由事件冒泡引入的事件委託

事件模型 首先我們認識一下事件模型: 上圖轉自:https://zhuanlan.zhihu.com/p/26536815 由上圖所示,事件模型分爲三個階段: 捕獲階段 目標階段 冒泡階段 在IE8及其以前,IE瀏覽

原创 字符串搜索匹配之 test&search&indexOf

這裏要討論的是字符串搜索匹配時常用到的API: test search indexOf search 該方法返回的是第一次匹配得到的結果,如果匹配到,返回第一次匹配得到的位置。如果沒有匹配到,返回-1。 var a = 'foof

原创 CSS僞類選擇器nth-child 和nth-of-type

首先要說明的一點是:css中的僞類選擇器還是少用爲妙,複雜的css選擇器(層級關係較深,僞類等)的性能並不好,主要應該影響的還是瀏覽器渲染時候的迴流(reflow)和重繪(repain)的等的性能(個人理解)。 然後要講正題啦! nt

原创 click事件

直接寫在html標籤中 <button id="clickMe" onclick="alert(1)">點我</button> 缺點:不利於js和html代碼分離。 2. onclick <button id="clickMe

原创 JS中的擴展運算符...

JS中的擴展運算符一般用於以下情況: 數組和對象的深拷貝(僅限單層數組或對象的深拷貝,實際上對於數組和對象的嵌套來說還是淺拷貝) let arr = ['a', 'b'] let arr1 = [...arr] let [...a

原创 ASCII, Unicode和UTF-8

ASCII 英文字符集的編碼方式:對應一個字節(8位),共可以表示256個字符,而英文字符集只需要128位,因此第一位是0。 Unicode 在ASCII編碼之後,其他國家語言的字符集也需要對應的編碼來表示,於是一時間出現了多種編碼