<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. 《Blue Flke》团队项目需求改进与系统设计

    Github地址:https://github.com/13993013291/ruanjianguigexuqiu/tree/master 一.团队项目需求分析改进 1.<通讯录管理系统需求说 ...

  2. 原生js的博客

    原生js一里边还有很多二三等http://www.cnblogs.com/charling/p/3527561.html 选区器 http://wenku.baidu.com/link?url=zr2 ...

  3. LeetCode--175--组合两个表

    问题描述: 表1: Person +-------------+---------+ | 列名 | 类型 | +-------------+---------+ | PersonId | int | ...

  4. Android Studio 常用快捷键和使用技巧

    Android Studio 1.Ctrl+E,可以显示最近编辑的文件列表 2.Shift+Click可以关闭文件 3.Ctrl+[或]可以跳到大括号的开头结尾 4.Ctrl+Shift+Backsp ...

  5. CF1082G Petya and Graph

    题意 定义图权 = 图中边权总和 - 图中点权总和(空图的图权=0),求 n 个点 m 条边的无向图最大权子图. 把边看成点,这个点与两个原图中的点连边.直接最小割求最大闭合子图即可.

  6. Python基础--Python简介和入门

    ☞写在前面 在说Python之前,我想先说一下自己为什么要学Python,我本人之前也了解过Python,但没有深入学习.之前接触的语言都是Java,也写过一些Java自动化用例,对Java语言只能说 ...

  7. ubuntu谷歌浏览器安装

    sudo apt-get install  chromium-browser-dbg 然后按照规定就好了.

  8. JS-图片控制-动画管理模块

    animateManage.js ;(function(window,document,undefined){ var _aniQueue = [], //动画队列 --- ani:动画,Queue: ...

  9. windows下python安装Numpy、Scipy、matplotlib模块

    来源http://blog.csdn.net/Katrina_ALi/article/details/64922107 http://blog.csdn.net/qq_16633405/article ...

  10. learning uboot bootargs panic parameter

    By passing the kernel panic parameter, the system automatically resets after 3 seconds when kernel p ...