獲取DOM節(jié)點:
document.getElementById():只能運用到document上, 返回找到的元素節(jié)點, 速度是最快的;dom.getElementsByTagName():能運用到所有元素節(jié)點上, 返回一個類數(shù)組的集合;dom.getElementsByClassName():同上;dom.querySelector():能運用到所有元素節(jié)點上, 返回第一個匹配的元素, 參數(shù)是標準的css選擇器;dom.querySelectorAll():能運用到所有元素節(jié)點上, 返回一個類數(shù)組的集合, 參數(shù)是標準的css選擇器;
操作class
dom.className:獲取或設(shè)置元素的class;dom.classList:返回元素的所有class的一個集合;dom.classList.add():追加指定的類名;dom.classList.remove():移除指定的類名; 不傳參數(shù)是不會做移除的喲;dom.classList.toggle():同時兼具移除和添加功能, 如果存在批定的類名則移除, 如果不存在則添加;dom.classList.contains():返回一個布爾值, 判斷節(jié)點是否包含指定的類名;
其他
navigator.userAgent中MicroMessenger可以來判斷是否為WeChat;document.referrer:獲取來源的URL;Array.prototype.slice.call(list):將一個類數(shù)組的集合轉(zhuǎn)換成一個真實的數(shù)組;input.value:獲取input的值;input.defaultValue:獲取input的默認值;selectEl.value:如果<select>中<option>沒有value屬性則獲取的是文本內(nèi)容脸爱，否則獲取value屬性的值;(都是獲取選中的<option>)selectEl.options:獲取<select>中所有<option>標簽业岁，是一個類數(shù)組的集合;selectEl.options.selectedIndex:獲取選中<option>的索引;selectEl.options[selectEl.options.selectedIndex].textContent:獲取選中<option>的文本內(nèi)容;
正則
- *: 匹配0到多次
- +: 匹配1到多次
- ?: 匹配0或1次
- g: 全局匹配岁诉，即不是搜到一個匹配就返回纬乍，而是搜出全部匹配 一般返回是一個數(shù)組
- i: 忽略大小寫
- m: 多行匹配
HTML
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">:讓IE瀏覽器以最新的引擎渲染, chrome=1可以激活chrome Frame;<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"><input autocapitalize="off">:禁用IOS中鍵盤自動大寫;<input>如果有<form>包裹, 打開軟鍵盤后顯示為'前往'; 否則顯示為'換行';
CSS
-webkit-appearance: none:移除元素的默認樣式, 尤其IOS上的表單元素, 默認會應(yīng)用系統(tǒng)樣式;-webkit-tap-highlight-color: rgba(0, 0, 0, 0):禁用元素按下后的背景顏色, 默認在移動設(shè)備上按下后會有一個灰色背景;-webkit-touch-callout:none;:禁用長按頁面時的彈出菜單(iOS下有效) ,img和a標簽都要加background-size:取值contain時, 寬高適應(yīng)內(nèi)容, 會全部顯示; 如果取值cover則寬高完全覆蓋背景, 可能會被裁切;-webkit-overflow-scrolling: touch:讓IOS中滾動條更流暢;
