美文网首页
我的第一个JavaScript

我的第一个JavaScript

作者: 烂笔头2020 | 来源:发表于2020-05-06 14:37 被阅读0次

下面的html是在工作之余写的一个比较简单的网页,里面着重的点我觉得是在script。

<!doctype>
<!DOCTYPE html> <!--文档类型声明-->
<html>
    <head> <!--用于描述网页的一些关键信息。比如网页的配置,设置,关键字等等这些信息-->
        <meta  charset="utf-8">
        <title>小仙女的第一个网页作业</title>
    </head>
    <body>
        <p> 问题一:你喜欢吃辣条吗?</p>
        <div>
            <input id="answer1" type="text">
        </div>
        <div>
            <button id="btn1">确认</button>
        </div>
        <div id="demo">
            确认后就可以看到我的答案啦!
        </div>
        <p>问题二:你觉得辣条好吃吗?</p>
        <div>
            <input id="answer2" type="text">
        </div>
        <div>
            <button id="btn2">确认</button>
        </div>
        
    </body>
    
    <script>
        document.getElementById("btn1").onclick = function() {
            var var1=document.getElementById("answer1").value;
            result1(var1);
        }
        document.getElementById("btn2").onclick = function() {
            var var2=document.getElementById("answer2").value;
            result2(var2);
        }       
        
        
        function result1(arg){
            if (arg=='喜欢'){
                document.getElementById("demo").innerHTML="我也喜欢吃!你也可以输入不喜欢或者其他试试哦!";
            }
            else if(arg=='不喜欢'){
                document.getElementById("demo").innerHTML="那么好吃既然不喜欢?!"
            }
            else{
                document.getElementById("demo").innerHTML="你只需要输入喜欢或者不喜欢!"
            }
        }
        
        function result2(arg){
            if (arg=='好吃'){
                alert("那当然啦!")
            }
            else if(arg=='不好吃'){
                alert("给机会你再说一次!")
            }
            else{
                alert("你只需要输入好吃或者不好吃!")
            }
        }
    </script>
            
</html>

相关文章

网友评论

      本文标题:我的第一个JavaScript

      本文链接:https://www.haomeiwen.com/subject/ysstghtx.html