js操作网页对象

最新推荐文章于 2023-06-16 09:53:16 发布

瑟瑟发抖的萌新学徒

最新推荐文章于 2023-06-16 09:53:16 发布

阅读量213

点赞数

本文链接：https://blog.csdn.net/m0_56420338/article/details/128044651

版权

以下操作在script标签下的function中执行

js中定义变量使用var关键词

根据id获取input控件

var input1(自己定义)=document.getElementByid("自定义id")(根据id获得)；

获得改控件的值

var inputValue(自定义)=input1.value;

弹出提示框

alert（inputVlaue）

input1.innerHTML="奇数"（在新的控件中显示奇数）；

""空字符串

实际操作

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript">
			function func1(){
				var input1=document.getElementById("na1");
				var inputValue=input1.value;
				var div1=document.getElementById("div1")
				if(inputValue==""){
					div1.innerHTML="<font size='7'color='aquag'> 不为空</font>";
				}else if(inputValue%2==1){
				div1.innerHTML="奇数";
				}else{
					div1.innerHTML="偶数                                                                                                                                                                                                                                   "
				}
			}

		</script>
		<style type="text/css">
			#div1{
				width: 300px;
				height: 200px;
				border:2px solid burlywood ;
			}
		</style>
	</head>
	<body>
		<input type="text" name="name" id="na1" value="" />
		<input type="button" value="按钮" onclick="func1()" />
		<div id="div1">
		</div>
	</body>
</html>

效果图：