1. <input type="button"> 實現密碼輸入框的可見和隱藏
直接修改value屬性即可
<script type="text/javascript"> function getPasswd(){ var passwd = document.getElementById("pwdID"); var pwdBtn = document.getElementById("pwdBtnID"); if(passwd.type=="password") { passwd.type="text"; pwdBtn.value="隱藏"; } else{ passwd.type="password"; pwdBtn.value="顯示"; } } </script> 密碼:<input id="pwdID" type="password"> <input id="pwdBtnID" type="button" onclick="getPasswd()" value="顯示">
2. <button> 實現視頻的播放和暫停
修改button的innerHTML
<script type="text/javascript"> function playVideo(){ var videoDiv = document.getElementById("videoId"); var videoBtn = document.getElementById("videoBtn"); if(videoDiv.paused){ videoDiv.play(); videoBtn.innerHTML = "暫停"; } else{ videoDiv.pause(); videoBtn.innerHTML="播放"; } } </script> <button id="videoBtn" type="button" onclick="playVideo()">播放</button>
3. innerHTML、innerText、outerHTML、outerText
innerHTML是符合W3C標准的屬性,其它屬性不推薦使用
下面是id=innerId的div幾個值的對應結果