打開網(wǎng)頁讓網(wǎng)頁顯示某個(gè)內(nèi)容:
alert("hello world");
打開網(wǎng)頁顯示對話框可以輸入內(nèi)容:
prompt("請輸入內(nèi)容:");
打開網(wǎng)頁顯示一個(gè)確認(rèn)的對話框:
confirm("你好嗎?");
在HTML網(wǎng)頁中寫入某個(gè)內(nèi)容:
document.write("hello world2");
在控制臺顯示內(nèi)容:
console.log("hello world3");
console.error("錯(cuò)誤信息");
console.warn("警告信息");
定義變量名稱
var num;
var num1, num2, num3;
定義函數(shù)
function 函數(shù)名(形參1腹尖,形參2...){
return 返回值;
}
獲取元素函數(shù);
document.getElementById(id) 用id去獲取
document.querySelector(css3選擇器) 用CSS3選擇器去獲取
document.querySelectorAll(CSS3選擇器) 用CSS3選擇器去獲取
document.querySelectorAll 如果想要取多個(gè)元素中的某個(gè)元素秽浇,就寫值[n]
n為多少偷溺,就取那個(gè)值酒来,這個(gè)值從0開始。
備注:id和CSS3選擇器都需要加引號
在控制臺輸出內(nèi)容醋拧,主要用來調(diào)試代碼
console.log()
事件函數(shù);
onclick() 點(diǎn)擊元素時(shí)候觸發(fā)
onmouseover 鼠標(biāo)移到元素上觸發(fā)
onmouseout 鼠標(biāo)從元素移走觸發(fā)
事件函數(shù)的格式
元素.onclick=function(){
這里寫處理代碼
};
頁面加載完后的函數(shù):
window.onload 頁面里所有內(nèi)容加載完成就觸發(fā)這個(gè)事件
格式
window.onload = function(){
這里寫處理代碼
};
驗(yàn)證值類型的函數(shù):
typeof(數(shù)據(jù))糜工;
instanceof(數(shù)據(jù));
把其他類型數(shù)據(jù)轉(zhuǎn)化成數(shù)字(整數(shù)):
parseInt(數(shù)據(jù));
或者Number(數(shù)據(jù));
parseFloat(數(shù)據(jù));(浮點(diǎn)型數(shù)字)
檢測值是不是NaN:
isNaN()
轉(zhuǎn)布爾值:
Boolean(數(shù)據(jù))
轉(zhuǎn)字符串:
String(數(shù)據(jù))
備注:alert,document.write會把數(shù)據(jù)強(qiáng)行轉(zhuǎn)化成string
取非行間樣式
IE7 低版本方法 obj.currentStyle[attr] attr就是要取的某個(gè)對象的具體樣式值
高版本方法 getComputedStyle(obj,false)[attr]
JS數(shù)組添加刪除函數(shù)
push(元素) 從尾部添加
unshift(元素) 從頭部添加
pop() 從尾部彈出
shift() 從頭部彈出
從中間添加刪除函數(shù)
splice(開始,長度惠拭,元素...)
先刪除,后插入
刪除
splice(開始庸论,長度)
插入
splice(開始,0职辅,元素..)
JS中sort只能認(rèn)識字符串,數(shù)字排序方法:
obj.sort(function(n1,n2){ return n1-n2;};
JS定時(shí)器函數(shù)
開啟定時(shí)器
setInterval(函數(shù),時(shí)間單位是毫秒) 間隔型 無限執(zhí)行
setTimeout(函數(shù)聂示,時(shí)間單位是毫秒)? 延時(shí)型 只執(zhí)行一次
停止定時(shí)器
clearInterval()
clearTimeout()
備注:關(guān)閉定時(shí)器方法
timer=serInterval()
clearInterval(timer)
JS獲取系統(tǒng)時(shí)間
Date對象
getHours getMinutes gerSeconds
字符串的解決低版本瀏覽器兼容問題
charAt()
獲取系統(tǒng)的年月日星期等元素函數(shù)
getFullYear() 年
getMonth() 月
getDate() 日
getDay() 星期
DOM基礎(chǔ)
childNodes DOM尋找子節(jié)點(diǎn)函數(shù) 可用children代替
nodeType DOM中判斷節(jié)點(diǎn)的類型 1是元素節(jié)點(diǎn) 3是文本節(jié)點(diǎn)
parentNode DOM中尋找父節(jié)點(diǎn)
offsetParent DOM尋找實(shí)際位置定位的父節(jié)點(diǎn)
DOM方式操作元素屬性
獲取 getAttribute(名稱)
設(shè)置 setAttribute(名稱域携,值)
刪除 removerAttribute(名稱)
DOM創(chuàng)建標(biāo)簽
document.createElement('標(biāo)簽名')
給某個(gè)標(biāo)簽添加子節(jié)點(diǎn)
標(biāo)簽名.appendChild(值)
插入元素
insertBefore(值,在哪個(gè)標(biāo)簽前插入)
文檔碎片(低版本瀏覽器提高DOM操作性能)
document.createDocumentFragment()
轉(zhuǎn)換成小寫字母
toLowerCase()
模糊搜索函數(shù)
search(值)備注:判斷值是否等于-1就可以做到模糊搜索
JS取絕對值
Math.abs()
向上取整
Math.cell()
向下取整
Math.floor()
JS中取代offsetLeft的函數(shù):
function getStyle(obj,name){
if(obj.currentStyle){
return obj.currentStyle[name];
}
else{
return getComputedStyle(obj,false)[name];
}
};
四舍五入取整函數(shù)
Math.round()
事件綁定(避免企業(yè)開發(fā)中代碼覆蓋造成BUG)
IE
attachEvent(事件名稱鱼喉,函數(shù)) 綁定事件
detachEvent(事件名稱秀鞭,函數(shù)) 解除綁定
備注:attachEvent事件名稱要帶on
DOM方式(針對chrome和FF)
addEventListener(事件名稱,函數(shù)扛禽,false)
removeEventListener(事件名稱锋边,函數(shù),false)
備注:addEventListener事件名稱不要帶on,用jQuery寫法旋圆。
事件捕獲
SetCapture()讓網(wǎng)頁中其他元素的所有事件變成你設(shè)置的那個(gè)事件
cookie使用方法
設(shè)置cookie
function setCookie(name,value,Day){
var oDate=new Date();
oDate.setDate(oDate.getDate()+Day);
document.cookie=name+"="+value+";expires="+oDate;
}
獲得cookie
function getCookie(name){
var arr=document.cookie.split("; ");
for(var i=0;i<arr.length;i++)
{ var arr2=arr[i].split("=");
if(arr2=name){
return arr2[1]
}
}else{
return "";
}
}
刪除cookie
function removeCookie(name){
document.cookie(name,1,-1);
}
正則表達(dá)式
search
字符串搜索
i-忽略大小寫
match
\d 找一個(gè)數(shù)字 /d/d找兩個(gè)數(shù)字 /d+找多個(gè)數(shù)字
g-全部找出
replace
\d 數(shù)字 = [0-9]
\w 英文,數(shù)字麸恍,下劃線 = [a-z0-9_]
\s 空白字符
\D 非數(shù)字 = [^0-9]
\W 非英文灵巧,數(shù)字,下劃線 = [^a-z0-9_]
\S 非空白字符
{n} 正好出現(xiàn)n次
{n,m} 最少n次抹沪,最多m次
{n,} 最少n次刻肄,最多不限制
+ = {1,} 相當(dāng)于最少1次,最多不限制
? = {0,1} 表示可有可無
* = {0,} 相當(dāng)于最少0次融欧,最多不限制
^ 字符串行首
$ 字符串行尾
/^\w+@[a-z0-9]+\.[a-z]+$/i 郵箱正則表達(dá)式
JS這塊可以說是前端開發(fā)的重中之重了敏弃,反正前端能力怎么樣就是看你的JS能力,JS這方面也是最難學(xué)的噪馏,內(nèi)容多麦到,需要理解,不適用死記硬背欠肾,特別的其中的原型瓶颠,繼承,this等等刺桃,都是需要理解而不是去背的東西粹淋。