String 的操作
charAt() 返回某位置的字符
charCodeAt() 返回某位置字符的字符編碼
indexOf() 左側開始檢測包含字符的位置
lastIndexOf() 右側開始檢測包含字符的位置
DOM
DOM基本查找方法:
document對應獲取body下對應的對象：
document.getElementById() 單一元素對象
document.getElementByClassName() 數組
document.getElementByTagName() 數組
可疊寫 ：gEBTN("").gEBI("")
設置CSS：gEBI("").style.background-color="#ffffff"
文本獲取 改寫 ele.innerHTML+="XX"
className獲取 改寫 ele.className;
HTML事件
鼠標點擊事件 onclick
鼠標經過事件 onmouseover
鼠標移開事件 onmouseout
聚焦 onfocus
失焦 onblur
文本框選中事件 onselect
文本框內容改變事件 onchange
加載事件 onload
卸載事件 onubload
鍵盤事件
按鍵時 onkeydown
按下并釋放一個鍵時 onkeypress
onkeyup 按鍵被松開時 onkeyup
等等...
DOM0級事件
語法：ele.事件=執行腳本
功能：在DOM對象上綁定事件
說明：執行腳本可以是一個匿名函數，也可以是一個函數的調用
onchange()例子:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
<script>
window.onload=function(){
var menu=document.getElementById("menu");
menu.onchange=function(){
if(this.value=="") return;
// console.log(this.value);
document.getElementById("box").style.background=this.value;
}
}
</script>
</head>
<body>
<div id="box" style="height: 200px;width: 200px">
<h4 style="display:inline-block">切換背景色:</h4>
<select id="menu">
<option value="">請選擇</option>
<option value="#00f">藍色</option>
<option value="#f00">紅色</option>
<option value="#ff0">黃色</option>
<option value="0f0">綠色</option>
</select>
</div>
</body>
</html>
JS內置對象
Date 日期方法 時間方法
瀏覽器對象
計時器:
間隔執行 setinterval() settimeout()
倒計時 clearinterval() cleartimeout()
技巧記錄
CSS3 旋轉 transform: rotate(xxdeg);
內陰影 box-shadow// inset
封裝一個代替getElementById的方法
function byid(id){
return typeof (id)==="string" ? document.getElementById(id):id;
}
