如何利用js从输入框中读取数值比较大小同时改变div的颜色

最新推荐文章于 2022-05-17 15:36:38 发布

甜辣嘟嘟嘟

最新推荐文章于 2022-05-17 15:36:38 发布

阅读量835

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_43627723/article/details/103392543

版权

前端专栏收录该内容

11 篇文章 2 订阅

订阅专栏

这是一个可以通过比较输入框内字体大小改变div颜色的小程序！

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title></title>
 <style type="text/css">
  #box{width: 100px;height: 100px;background-color: red;}
 </style>
</head>
<body>
 <script type="text/javascript">
  var x=document.getElementById('input1').value;
  var y=document.getElementById('input2').value;
  function re(){
   if(parseInt(x)>parseInt(y)){
    alert("大于");
    var div1=document.getElementById('box');
    div1.style.backgroundColor='blue';
   }
   else{
    alert("小于");
    var div1=document.getElementById('box');
    div1.style.backgroundColor='blue';
   }
  }
 </script>
 <input id='input1' type="text" name="">
 <input id='input2' type="text" name="">
 <input id='sub' onclick='re();' type="submit" name="" value="提交">
 <div id='box'></div>
</body>
</html>

运行结果如下所示：

在这里插入图片描述

做了好长好长时间的成果，不是这里错，就是哪里错。尤其是document一直忘记！
细心真的很重要！！！
并且document.getElementTagName还不会！加油油！
始终相信！
越努力，越幸运！

甜辣嘟嘟嘟

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
如何利用js从输入框中读取数值比较大小同时改变div的颜色

这是一个可以通过比较输入框内字体大小改变div颜色的小程序！<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box{width: 100px;height: 100...
复制链接

扫一扫