第一题:
1、给等于号的元素添加点击事件
1)在"="元素上面添加onclick属性=“getSum()”
2)在js文件中获取“=”的元素,元素.onclick=function jia(){
}
备注:onmouseover、onmouseout、onmousedown、onmouseup、onkeydown、onkeypress、onkeyup
2、定义函数,实现点击后的效果
1)获取第一个和第二个文本框的值
var firstNum= document.getElementById("first").value;
var secondNum= document.getElementById("second").value;
备注: document.getElementsByName("zhangsan")
document.getElementsByTagName("标签名")
value、innerText、innerHTML三个属性的区别 <li><a>英雄联盟</a></li>
系统函数:parseInt,parseFloat isNaN
2)求和并给第三个文本框赋值
var sum=firstNum+secondNum document.getElementById("thrid").value=sum
第二题:
1)如何启用按钮
document.getElementById("btnShow").disabled=false;
2)如何让按钮中的数字递减
var num=5;
function time(){
document.getElementById("btnShow").value="请仔细阅读协议("+num+")";
num--;
}
var mySetInterval= setInterval("time()",1000); --每隔一秒执行函数time()
3)如何让数字等于0时停止递减并启用按钮
function time(){ //当num大于0时递减,并输出数字,否则,按钮的文字改为“同意”并启用按钮, if(num>0){ document.getElementById("btnShow").value="请仔细阅读协议("+num+")"; num--; }else{ //将按钮文本改为“同意” //启用按钮 //清除定时函数,否则死循环导致页面后期卡顿 } }
备注:setInterval,clearInterval,setTimeout、clearTimeOut 四个定时函数
第三题:
思考:如何实现鼠标移入和移出,移入后如何确定是否为当前的li
如何实现鼠标点击,并将当前元素删除,追加到第二个ul中
1)给第一个ul下的li添加onmouseover(鼠标移入)、onmouseout(鼠标移出)属性
例如:<li onmouseover="addBgColor(this)" onmouseout="removeBgColor(this)">火箭</li>
备注:每个函数中的this代表当前元素
2)给onmouseover事件指定函数,实现背景颜色为红色
function addBgColor(obj){
obj.style.backgroundColor="red";
}
3)给onmouseout事件指定函数,实现移出红色背景功能(将背景色改为白色)
function removeBgColor(obj){
obj.style.backgroundColor="white";
}
4)给第一个ul下的li添加onclick属性
例如:<li onmouseover="addBgColor(this)" onmouseout="removeBgColor(this)" onclick="moveLi(obj)">火箭</li>
5)给onclick事件指定函数,实现删除当前元素,将当前元素追加到第二个ul中(this参数代表当前元素)
function moveLi(obj){ //删除当前元素 document.getElementById("firstUL").removeChild(obj); //将obj当前元素追加到第二个ul中 document.getElementById("secondUL").appendChild(obj) }