属性操作-模拟短信发送1（替换短信内容）

最新推荐文章于 2022-05-15 13:49:01 发布

erdouzhang

最新推荐文章于 2022-05-15 13:49:01 发布

阅读量474

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/erdouzhang/article/details/72827674

版权

js 专栏收录该内容

98 篇文章 0 订阅

订阅专栏

在线演示

这里写图片描述

点击发送按钮，input输入框中的内容会发送到上面的方框中，并且输入框清空。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>属性操作-模拟短信发送</title>
    <style>
        #con {
            width: 240px;
            height: 200px;
            background-color: #f1f1f1;
            padding: 10px;
            border: 1px solid #000;
        }
    </style>
    <script>
        window.onload =function(){
            // alert('123');
            var con = document.getElementById('con');
            var txt = document.getElementById('txt');
            var btn = document.getElementById("btn");
            btn.onclick = function(){
                //判断输入框的内容是否为空
                if(txt.value == ''){//如果为空，弹出提示
                    alert('请输入点内容吧~');//
                }else{//否则发送内容
                    con.innerHTML = txt.value;
                    txt.value = '';//内容发送之后就清空value值
                }
            }
        }
    </script>
</head>
<body>
    <div id="con"></div>
    <span>短信：</span>
    <input type="text" id="txt">
    <input type="button" value="发送" id="btn">
</body>
</html>