关于innerHTML改变div文本内容无效的问题

发布于 2022-09-06 23:43:44 字数 2115 浏览 8 评论 0

这个问题折腾我一晚上了,因为觉得是很简单的问题,没想到是哪出错了,请各位帮我看一下;
问题描述:
一个简单的表单验证的demo,在Input里输入文本之后,通过button的click事件处理函数验证输入的文本,然后我用innerHTML去改变文本的内容,发现无 用;emmmm;

各种搜索也没有看到说innerHTML改变div文本内容无效

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="../../../bootstrap-3.3.7-dist/css/bootstrap.css">
        <link rel="stylesheet" href="main.css">
        <!-- <script src="test.js"></script> -->
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-md-offset-2">
                    <form class="form-horizontal">
                        <div class="form-group">
                           <label for="username" class="col-sm-2 control-label"> 名称</label>
                           <div class="col-sm-7">
                           <input type="text" id="username" class="form-control" placeholder="请输入用户名">
                           </div>
                           <button class="btn btn-primary">验证</button>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-10" id="desc">必填,长度为4-16个字符</div>
                        </div>
                    </form>
            </div>
        </div>
        </div>
        <script>
            window.onload=function (){
    var btn=document.getElementsByClassName("btn")[0];
    var desc=document.getElementById("desc");
    btn.addEventListener("click",valihandler,false);
    // console.log(desc.innerHTML)
    function valihandler(e){
        var user=document.getElementById("username").value;
        var pat=/\w{4,16}/;
        var namelen=user.length;
        if(namelen==0){
            console.log(desc);
            desc.innerHTML='格式错误';
        };
    }

   
}
        </script>
    </body>
</html>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文