A.我今天學了什么
1.首字母轉化
var str = "how are you"
var reg = /(^|\s)(\w)/g
// var s = str.match(reg)
var s = str.replace(reg,function(m,p1,p2){
return p1+p2.toUpperCase();
})
/*
函數參數的規定:
1. 第一個參數為每次匹配的全文本($&)。
2. 中間參數為子表達式匹配字符串,個數不限.( $i (i:1-99))
3. 倒數第二個參數為匹配文本字符串的匹配下標位置。
4. 最后一個參數表示字符串本身。
2.事件委托
<body>
<script type="text/javascript">
/*-------事件委托 (委派)----------
利用事件冒泡在機制,給父級綁定事件,子集也會接收到
1、動態添加 li 也會接受父級d事件
2、循環綁定事件 性能好
var ul = document.getElementById("ul");
var btn = document.getElementById("btn");
//把本來應該給li注冊的事件,委托給ul,只需要給一個元素注冊事件
//動態創建的li,也會執行預期的效果
ul.addEventListener("click", test, false); //注冊點擊事件
btn.onclick = function () { //點擊同樣會有alert
var li = document.createElement("li");
li.innerHTML = "我是新插入的li標簽";
ul.appendChild(li);
};
//函數寫在注冊事件代碼之外,提高性能
function test(e) {
alert(e.target.innerText);
}
</script>
*/
<!-- ———————————————— -->
<ul id="ul">
<li>我是第1個li標簽</li>
<li>我是第2個li標簽</li>
<li>我是第3個li標簽</li>
<li>我是第4個li標簽</li>
</ul>
<input type="button" value="insertLi" id="btn">
</body>
3.鍵盤事件
document.onkeydown=function(event){
var e = event || window.event;
// if(e && e.keyCode==27){ // 按 Esc
// //要做的事情
// }
// if(e && e.keyCode==113){ // 按 F2
// //要做的事情
// }
//
// ctrlKey shiftKey altKey 返回true;
//
if(e.ctrlKey && e.keyCode == 13){
alert(1)
}
// if(e && e.keyCode==38){ // enter 鍵
// alert(1)
// }
//
// alert(e.keyCode)
};
document.onclick = function (){
window.location.hash = "#a1"
}
4.分頁
// var str = window.location.search.slice(1);
// var s1 = str.replace(/=/,"\":\"")
// // var s2 ="\"" + s1 + "\"";
// // es6方法 不用字符串拼接 就 `--${變量}----`
// var s2 =`{"${s1}"}`
// // 字符串轉為對象
// var obj = JSON.parse(s2)["a"]
var lis = document.getElementsByTagName("li")
var pageSize = 25;
var page = Math.ceil(lis.length/pageSize)
// 頁碼
for(var i =1;i<=page;i++){
var a = document.createElement("a");
a.innerHTML = i;
a.href = "09-分頁.html?a="+i;
document.getElementById("d").appendChild(a)
}
// 獲取頁碼
var PAGE = getPage("a");
// 剛開始 頁面中沒有 location.search 需要做判斷
if(!PAGE){
PAGE = 1;
}
var start = (PAGE-1)*pageSize; //(1-1)10 從0開始
var end = start+pageSize; //(1)10 到10結束
for(var i = start;i<end;i++){
// 做判斷
if(lis[i]){
lis[i].className = "show"
}
}
function getPage(PageName){
// 剛開始沒有 ? 做判斷
if(location.search.indexOf("?")==-1){
return false;
}
// 去除?
var str = window.location.search.slice(1);
// 去除 "=" 替換成 ":"
var s1 = str.replace(/=/,"\":\"")
// var s2 ="\"" + s1 + "\"";
// es6方法 不用字符串拼接 就 `--${變量}----`
var s2 =`{"${s1}"}`
// 字符串轉為對象
return JSON.parse(s2)[PageName]
}
5.JSON.parse
/*JSON.parse用于從一個字符串解析出對象,如*/
// var str = '{"ne":"張三"}'
// var obj = JSON.parse(str)
// JSON.parse("[1, 2, 3, 4, ]");
// JSON.parse('{"foo" : 1, }');
/*JSON.stringify()用于從一個對象解析出字符串,如*/
// var obj = {
// "ne":"張三",
// "age":20
// }
// var str = JSON.stringify(obj)
//
// 可以解析 執行 字符串
// eval()