清空或删除html标签

一.新增及删除标签

新增拼接的html标签：

    AddGroupId:function(){
        var groupId=$('#groupId2').val().trim();
        var groupName=$('#groupId2').find('option:selected').text();
        var v_content = "<p class='groupA'><span groupId=\""+groupId+"\" groupName=\""+groupName+"\">"+groupName+" </span>"+
            "<a href=\"javaScript:void(0);\" onclick='groupAdd.deleteGroupId(this)'>删除 </a></p>";
            $("#groupIdList1").append(v_content);
            //$("#selected").append(v_content);
},

点击删除按钮，删除新增的html标签：

deleteGroupId:function(obj){
$(obj).parent().remove();
},

1.通过标签获取父节点，然后把包含该子节点的父节点一起删除。

二.网上查到的其他队友写的，清空及批量删除方法：

原文链接：https://blog.csdn.net/changqing5818/article/details/54313132/

清空输入框

$("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(); });

清空或删除html标签

猜你喜欢