zoukankan      html  css  js  c++  java
  • 通过JS动态创建和删除HTML元素

    <script type="text/javascript" language="Javascript">
    function InputOnBlur()
    {        var name=document.getElementById("name").value;

             if(name.length >10 || name.length<2)
                 {
                    var element=document.getElementById("message");
                if(element)
                {
                //alert(element.parentNode.innerHTML);
                element.parentNode.removeChild(element);
                }
                                 var MySpan=document.createElement("span");
                                 document.getElementById("containers").appendChild(MySpan);
                                 MySpan.id = "message";
                                 MySpan.innerHTML = "<img src='false.jpg' alt='请输入正确的姓名'/>请输入正确的姓名";
                    }
                    
             else{
                var element=document.getElementById("message");
                if(element)
                {
                //alert(element.innerHTML);
                element.parentNode.removeChild(element);
                }
                                 var MySpan=document.createElement("span");
                                 document.getElementById("containers").appendChild(MySpan);
                                 MySpan.id = "message";
                                 MySpan.innerHTML = "<img src='true.gif' alt='该用户名输入正确'/>该用户名输入正确";
                        }
    }
    </script>
     
     


    <div>    
    姓名:<input id="name" type="text" onblur="InputOnBlur()" /><span id="containers"></span></div>    
    <script language="javascript">    
    document.getElementById("containers").innerHTML = "<font color=red>请输入姓名</font>";    
    </script>   

  • 相关阅读:
    C++之用程序理解浅拷贝
    es6 | 新增语法 | 总结
    http协议 | http缓存
    Mobx | 强大的状态管理工具 | 可以用Mobx来替代掉redux
    nohup和&后台运行,进程查看及终止
    MIME Type介绍 Content-Type 各种定义
    Meta http-equiv属性详解(转)
    sublme text 3 快捷键
    【坑】【数组的坑】1、对象assign复制的假深度,2、数组slice复制的坑,3、还有数组map复制的坑
    Proxy监听对象的数据变化,处理绑定数据很有用
  • 原文地址:https://www.cnblogs.com/focai/p/4094771.html
Copyright © 2011-2022 走看看