<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>

通过JS动态创建和删除HTML元素的更多相关文章

  1. js动态创建表格,删除行列的小例子

    js动态创建表格,删除行列的实例代码. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  2. js动态创建和删除option

    1.动态创建select function createSelect(){           var mySelect = document.createElement("select&q ...

  3. 原生JS动态添加和删除类

    原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...

  4. 通过js动态创建button

    通过js动态创建button 一.实例描述 通过JS的DOM对象,实现元素的动态创建. 二.效果 三.代码 <!DOCTYPE html> <html lang="zh-c ...

  5. form表单 无法提交js动态添加的表单元素问题。。

    第一种情况, 这种情况js动态添加的表单元素是不能提交到服务器端的 <table> <form method="post" action=" url   ...

  6. js动态创建及移除div的方法

    本文实例讲述了js动态创建及移除div的方法.分享给大家供大家参考.具体实现方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 ...

  7. 用JS动态创建登录表单,报了个小错误

    后来发现原来是: dvObj.style.border='#Red 1px sold'; 其中的Red多谢了一个‘#’, 但是奇怪的是在chrome和firefox都备有报错,但是在ie中报错了. 各 ...

  8. js动态创建样式: style 和 link

    js动态创建样式: style 和 link ie6 不能 document.createElement('style') 然后append到head标签里.所以就找到这样个好文章 有很多提供动态创建 ...

  9. UEditor js动态创建和textarea中渲染【原】

    UEditor动态创建和textarea中渲染 http://ueditor.baidu.com/website/examples/textareaDemo.html <!DOCTYPE> ...

随机推荐

  1. java动态代理和cglib

    1.代理类可以分为两种. 静态代理:由程序员创建或特定工具自动生成源代码,再对其编译.在程序运行前,代理类的.class文件就已经存在了. 动态代理:在程序运行时,运用反射机制动态创建而成. 2.JD ...

  2. HDU 6090 Rikka with Graph

    Rikka with Graph 思路: 官方题解: 代码: #include<bits/stdc++.h> using namespace std; #define ll long lo ...

  3. 【python】模块整理

    ---文件.系统--- import glob  # 给定路径下查找符合规则文件.三个匹配符:”*”, “?”, “[]”.”*”匹配0个或多个字符:”?”匹配单个字符:”[]”匹配指定范围内的字符, ...

  4. Java成员变量和局部变量

    Java成员变量和局部变量 一.成员变量和局部变量 二.static关键字 三.成员变量和静态变量区别 四.main函数 五.静态函数什么时候用 六.静态代码块 七.构造代码块 构造代码块先于构造函数 ...

  5. 为什么HikariCP被号称为性能最好的Java数据库连接池,如何配置使用

    转自:https://blog.csdn.net/clementad/article/details/46928621 HiKariCP是数据库连接池的一个后起之秀,号称性能最好,可以完美地PK掉其他 ...

  6. 读写生信流程必备的 Perl 语法

    最早就是写Perl的,后来来到公司转Python,现在又要负责流程了,开始重拾Perl,当然是借鉴别人现有的语法,我再重新组合. 基本语法就不介绍了,参照我之前文章 Perl   模块 use str ...

  7. inputsimulator - Windows Input Simulator

    窗体输入模拟器提供一个基于 win32 SendInput  方法的 模拟键盘鼠标输入的.net 接口.windows 输入模拟器可用于 WPF.windows 窗体和控制台应用程序, 实现模拟任意按 ...

  8. memcached客户端连接建立过程笔记

    memcached在启动过程初始化server_sockets时,根据启动参数决定系统是进行tcp监听还是udp监听,这里暂时只关注tcp的情况. server_socket在初始化时会向系统申请监听 ...

  9. pandas的concat函数和append方法

    pd.concat(objs, axis=0, join='outer', join_axes=None, ignore_index=False,keys=None, levels=None, nam ...

  10. ural Ambitious Experiment 树状数组

    During several decades, scientists from planet Nibiru are working to create an engine that would all ...