遺忘的知識(shí)點(diǎn)回顧

1.事件onkeydown onkeyup 連等,可用oninput 事件當(dāng)輸入時(shí)(高級(jí)瀏覽器好用)
處理兼容:
onpropertychange(當(dāng)屬性改變的時(shí)候,兼容低版本ie),不適用于ie9,處理ie9使用變態(tài)方法:定時(shí)器。微博統(tǒng)計(jì)數(shù)字代碼展示:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<script>
window.onload=function(){
var oT=document.getElementById('t1');
var oSp=document.getElementById('sp1');
var timer=null;
if(window.navigator.userAgent.indexOf('MSIE 9.0')!=-1){
oT.onfocus=function(){
timer=setInterval(function(){
oSp.innerHTML=oT.value.length;
},100);
};
oT.onblur=function(){
clearInterval(timer);
};
}else{
oT.oninput=oT.onpropertychange=function(){
oSp.innerHTML=this.value.length;
document.title=this.value.length;
};
}
};
</script>
</head>
<body>
<input type="text" id="t1" value="" />
<span id="sp1">0</span>
</body>
</html>

2.DOM操作的增刪改查:
增:obj.appendChild(創(chuàng)建的元素);
刪:obj.removeChild(創(chuàng)建的元素);
改:obj.innerHTNL='';
查:obj.parentNode();結(jié)構(gòu)父級(jí)
obj.offsetParent();定位父級(jí)
示例:簡易留言板

<!DOCTYPE html><html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<script>
window.onload=function(){
var oUl=document.getElementById('ul1');
var oBtn=document.getElementById('btn');
var oT=document.getElementById('txt');
oBtn.onclick=function(){
//創(chuàng)建li
var oLi=document.createElement('li');
//li里添加內(nèi)容
oLi.innerHTML=''+oT.value+'<a href="javascript:;">刪除</a>';
//往ul添加
if(oUl.children.length){
oUl.insertBefore(oLi,oUl.children[0]);
}else{
oUl.appendChild(oLi);
}
//清除value
oT.value='';
var oA=oLi.children[0];
oA.onclick=function(){
oUl.removeChild(oLi);
};
};
};
</script>
</head>
<body>
<input type="text" id="txt" />
<input type="button" value="留言" id="btn"/>
<ul id="ul1">
<!--<li>1111<a href="javascript:;">刪除</a></li>-->
</ul>
</body>
</html>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容