如何删除HTML的span标签

前言

最近使用JQuery-validate插件以及BootStrap的模态框做输入验证，然后遇到一个问题：关闭模态框后，样式以及输入内容无法清除， 除非自己再加事件，去做resetForm，索性根据HTML元素，做成全局使用的。

清空输入框

首先做一点科普：

$("form :input") 返回form中的所有表单对象，包括textarea、select、button等$("form input") 返回form中的所有input标签对象$(“form>input”) 选择所有指定“form”元素中指定的"input"的直接子元素form input 是属于层级选择器(将每一个选择器匹配到的元素合并后一起返回)form :input是属于表单选择器(匹配所有<input>、<textarea>、<select>、<button>元素)

清空操作

$('input', form).each(function(){    var type = this.type;    var tag = this.tagName.toLowerCase();    if(tag == 'text' || tag == 'password' || tag == 'textarea') {        this.value = '';    } else if (type == 'checkbox' || type == 'radio') {        this.checked = false;    } else if (type == 'select') {        this.selectedIndex = -1;    }});

删除span标签

方法1：根据id

function removeSpan(){     var obj = document.getElementById("span1");    var parent = obj.parentNode;    parent.removeChild(obj);//在这里通过父节点＋待删除节点对象来删除    //下面是span自己删除自己，true表示连子节点也一起删除，本例是childspan,但是false的话自己和子节点多不会删除     //obj.removeNode(true);     //另外如果使用了jquery，可以这么写： $(obj).remove(); } 

方法2：遍历form

$('span', form).each(function(){    $(this).remove();});

删除样式

科普
closest() - http://www.w3school.com.cn/jquery/traversing_closest.asp

定义和用法

closest() 方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上。

语法/b>

.closest(selector)

参数 描述

Jquery-validate验证错误、成功样式删除

$('form div').closest('.form-group').removeClass('has-success');$('form div').closest('.form-group').removeClass('has-error');