动态改变按钮文字
<script> window.onload = function () { //为每个按钮注册单击事件 var inputs = document.getElementsByTagName('input'); for (var i = 0; i < inputs.length; i++) { if (inputs[i].type == "button") {//判断是否为按钮 inputs[i].onclick = function () { //在每个按钮的单击事件中，让所有的都变成哈哈，同时被点击的按钮编程呜呜 //设置所有的按钮都为哈哈 for (var e = 0; e < inputs.length; e++) { if (inputs[e].type == "button") { inputs[e].value = "哈哈"; } } //设置当前被点击按钮为呜呜 this.value = "呜呜"; } } } } </script> </head> <body> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> </body>
<script type="text/javascript"> window.onload = function () { //获取所有input按钮 var inputs = document.getElementsByTagName('input'); //遍历 for (var i = 0; i < inputs.length; i++) { //input是button的 if(inputs[i].type=='button'){ inputs[i].onclick = function () { //动态赋值赋值其他按钮的值为哈哈 for (var e = 0; e < inputs.length; e++) { if (inputs[e].type == 'button') { inputs[e].value = "哈哈"; } } //自身变为呜呜 this.value = "呜呜"; } } } } </script> </head> <body> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> </body>
倒计时
<script type="text/javascript"> window.onload = function () { //获取所有input按钮 var inputs = document.getElementsByTagName('input'); //遍历 for (var i = 0; i < inputs.length; i++) { //input是button的 if(inputs[i].type=='button'){ inputs[i].onclick = function () { //动态赋值赋值其他按钮的值为哈哈 for (var e = 0; e < inputs.length; e++) { if (inputs[e].type == 'button') { inputs[e].value = "哈哈"; } } //自身变为呜呜 this.value = "呜呜"; } } } } </script> </head> <body> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> <input type="button" name="name" value="哈哈" /> </body>
计算器
<script type="text/javascript"> window.onload = function () { document.getElementById('btn').onclick = function () { //设置为数字 document.getElementById('txt3').value = parseInt( document.getElementById('txt1').value) + parseInt( document.getElementById('txt2').value); } } </script> </head> <body> <input type="text" name="name"value=""id="txt1"/>+<input type="text" name="name" value="" id="txt2" /><input type="button" name="name" value="="id="btn" /><input type="text" name="name" value="" id="txt3" /> </body>
美女时钟
<script type="text/javascript"> window.onload = function () { setInterval(function () { //获取当前时间 var d = new Date(); //获取时间的小时部分和分钟部分 var hh = d.getHours(); var ss = d.getSeconds(); hh = hh < 10 ? '0' + hh : hh; ss = ss < 10 ? '0' + ss : ss; //根据获取的时间动态拼接一个图片路劲 var imgUrl='Images/'+hh+'_'+ss+'.jpg'; //赋给新的img document.getElementById('newImgUrl').src = imgUrl; },1000) } </script> </head> <body> <img id="newImgUrl" src="Images/00_00.jpg" alt="Alternate Text" /> </body>