<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
/*
* 条件判断总结:
1.if条件语句
（1）if(条件){}
(2)if(条件1){}
else if(条件2){}
(3)if(条件1){}
else if(条件2){}
else if（条件3){}
例1：
window.onload = function()
{
var Btn1 = document.getElementById('btn1');
var Btn2 = document.getElementById('btn2');
var oP = document.getElementById('p1');
var num = 15;
Btn1.onclick = function()
{ if(num<22)
{
num++;
oP.style.fontSize = num+'px';
alert(num);
}
};
Btn2.onclick = function()
{
if(num>11)
{
num--;
oP.style.fontSize = num+'px';
alert(num);
}
};
};
*/
window.onload = function(){
var oBtn = document.getElementById('btn');
var oText = document.getElementById('text1');
var oDiv = document.getElementById('div1');
var oSpan = document.getElementById('span1');
var oImg = document.getElementById('oimg');
var onOff = true;
oBtn.onclick = function()
{
if(oText.value=='')
{
alert('输入不能为空，请重新输入~~')
}else
{
oDiv.innerHTML +=oSpan.innerHTML+oText.value+'</br>';
oText.value = '';
}
};
oImg.onclick = function()
{
if(onOff)
{
oImg.src = "img/1.jpeg"
onOff = false;
}
else{
oImg.src = "img/3.jpeg"
onOff.src = ture;
}
};
};
</script>
<style>
div{width:200px;height:200px;border:1px solid #9C9C9C;background: #F7F7F7;}
img{width:200px;height:200px;}
</style>
</head>
<body>
<!--<input id="btn1" type="button" value="+"/>
<input id="btn2" type="button" value="-" />
<p id="p1">让我们荡起双桨，小船儿推开波浪！！</p>-->
<div id="div1"></div>
<span id="span1">会话：</span>
<input id="text1" type="text"/>
<input id="btn" type="button" value="提交"/>
<img id ="oimg" src="img/2.jpg"/>
</body>
</html>
JS基础之if判断语句
最新推荐文章于 2023-01-04 19:58:05 发布
7969
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
