jquery attr 删除（如何删除jQuery对象中元素）

本文目录

• 如何删除jQuery对象中元素
• jQuery如何控制动态的页面元素
• JQUERY 如何删除动态添加的元素
• 如何利用jquery来给input添加或删除disabled属性全部方法总结

如何删除jQuery对象中元素

1、可以这样做：1234window._obj = ’张三’;//定义对象，这时候有了一个对象_objconsole.log，控制台输出对象:张三delete window._obj;//删除对象nameconsole.log(window._obj);//控制台输出：Undefind，1$(’#your_id’).remove。

2、$(document).ready(function(){ $(".tab1_tag1_con a").click(function(){ var $abca=$(this).html(); var $parent = $(".tab1_tag2_con"); var $parentlen=$(".tab1_tag2_con").children("a").length; alert(’《a href="javascript:void(0)"》’+$abca+’《/a》’); if ($parentlen《9) { $parent.append(’《a href="javascript:void(0)"》’+$abca+’《/a》’); } else { alert("不能添加超过10个"拍蔽); } }); $(".input_bt7").click(function(){ var $city = $("#input_bt77").attr("value"); var $parent = $(".tab1_tag2_con"); $parent.append($city); }); $(".tab1_tag2_con a").click(function(){ $(this).remove(); }); }); 删除袭搜州tab1_tag2_con a里原有的《a》就可以，但是不能删除后来添加的《a》。

3、remove方法移除被选元素，包括所有文本和子节点，该方法不会把匹配的元素从 jQuery 对象中删除，因而可以在漏搭将来再使用这些匹配的元素。

4、但除了这个元素本身得以保留之外，remove不会保留元素的 jQuery 数据，其他的比如绑定的事件、附加的数据等都会被移除。

jQuery如何控制动态的页面元素

这次给大家带来jQuery如何控制动态的页面元素，jQuery控制动态的页面元素的注意事项有哪些，下面就是实战案例，一起来看一下。
背景
最近做了一个小系统，其中需要在页面对用户的好友进行增删改查。本来没有那么复杂，用表格行纳禅形式就可以相对容易的实现。
但是考虑到用户的体验度，首先添加尽量不想用输入，就采用将所有用户分类显示，然后点击即可添加。
添加的用户同时在界面显示，显示出用户当前的好友。同时点击已经添加好的好友可进行下一部的业务操作。
当然，删除的操作是仿照手机端那样，右上角有一个红色茄拦的“x”，点击该好友即可删除。
最后界面还能退出删除的模式，恢复正常的模式。
功能说明
1. 添加用户：在列表中点击即添加用户，同时添加onclick事件
2. 删除用户：点击该好友即可删除
3. 进入删除模式：将界面改为删除模式，切换onclick事件
4. 恢复正常模式：将界面改为正常模式，切换onclick事件
图片展示
代码
//添加用户为自己常用好友
function Add(e) {
var friend_id = e.id;
var name = $("#" + friend_id).html();
//将要插入页面的好友html代码
var content = "《p id=\"friend" + friend_id + "\" class=\"case-item\" onclick=\"" + game_type + "(this)\"》《p class=\"ih-item circle effect1\"》《a href=\"#\"》《img class=\"img_wrong\" src=\"image/wrong.png\" style=\"float: right; width: 15px; height: 15px;display:none\" /》《p class=\"spinner\"》《/p》《p class=\"img\"》《h3 id=\"" + friend_id + "\"》档尘" + name + "《/h3》《/p》《p class=\"info\"》《p class=\"info-back\"》《h3 class=\"info-word\"》" + info_word + "《/h3》《/p》《/p》《/a》《/p》《/p》";
//向数据库添加，通过结果来确定界面显示
$.ajax({
url: "userlist.aspx/AddFriend",
data: "{’username’:’" + $(’#username’).text() + "’,’friend_id’:’" + friend_id + "’}",
type: ’Post’,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
if (result.d == "true") {
$(".case-content").append(content);//数据库添加成功，插入html代码
}
else {
alert(result.d);
}
},
error: function (err) {
alert("未知错误");
}
});
}
//删除好友
function Delete(e) {
var friend_id = e.id;
$.ajax({
url: "userlist.aspx/DeleteFriend",
data: "{’username’:’" + $(’#username’).text() + "’,’friend_id’:’" + friend_id + "’}",
type: ’Post’,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
if (result.d == true) {
$("#" + friend_id).remove();//在界面移除好友
}
if (result.d == false) { alert("删除失败"); }
},
error: function (err) {
alert("未知错误");
}
});
}
//重置好友-切换到删除模式
function ChangeToDelete() {
$(".case-item").removeAttr("onclick");//删除onclick事件
$(".case-item").attr("onclick", "Delete(this);");//添加新的onclick事件
$(".img_wrong").css("display", "block");//使删除图标可见
$(".info-word").html("删除");//改变提示文字
}
//关闭重置-切换到正常模式
function ChangeToNormal() {
$(".case-item").removeAttr("onclick");//删除onclick事件
$(".case-item").attr("onclick", "");//添加新的onclick事件
$(".img_wrong").css("display", "none");//使删除图标不可见
$(".info-word").html(info_back);//恢复提示文字
}小结
这次练习学到的内容有两点：
1. Ajax和后台的交互；
2. JQuery对页面元素的属性控制
最后想说的是，真正有个需求驱动你的时候，你会实践很多，学到很多。
相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！
推荐阅读：
jackson解析json串时大小写自动转换的方法
ajax请求后台数据成功后无反映应该如何处理
jQuery EasyUI选项卡面板的tabs使用

JQUERY 如何删除动态添加的元素

删除可以使用  jQuery 文档操作 - remove() 方法

定义和用法

　　remove() 方法移除被选元素，包括所有文本和子节点。

　　该方法不会把匹配的元素从 jQuery 对象中删除，因而可以在将来再使用这些匹配的元素。

　　但除了这个元素本身得以保留之外，remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除。这一点与 detach() 不同。

实例穗裤

《!--移除猜吵简所有P元素--》
《html》
《head》
《script type="text/javascript" src="/jquery/jquery.js"》《/script》
《script type="text/javascript"》
$(document).ready(function(){
  $("button").click(function(){
    $("p").remove();
  });
});
《/script》
《/head》
《body》
《p》这是一个段落。《/p》
《p》这是另一个段落。《/p》
《button》删除所有 p 元素《/button》
《/body》
《/html》

添加元素可以使用  jQuery 文档操作 - append() 方法

定义和用法

　　append() 方法在被选元素的结尾（仍然在内部）插入指定内容。

实例

《!--在每个 p 元素结尾插入内容--》
《html》
《head》
《script type="text/javascript" src="/jquery/jquery.js"》《/script》
《script type="text/javascript"》
$(document).ready(function(){
  $("button").click(function(){
    $("p").append(" 《b》Hello world!《/b》");
  });
});
《/script》
《/head》
《body》
《p》This is a paragraph.《/p》
《p》This is another 碰拍paragraph.《/p》
《button》在每个 p 元素的结尾添加内容《/button》
《/body》
《/html》

拓展：jQuery添加元素的方法还有before()、after()、insertAfter() 、insertBefore()、appendTo()、prepend()、prependTo()等等。可以查看jquery官网文档或者W3School的jQuery 参考手册 - 文档操作

如何利用jquery来给input添加或删除disabled属性全部方法总结

一、以下二种方法是可以为input添加disabled属性的方法

1、$(’#areaSelect’).attr("disabled",true)

2、$(’#areaSelect’).attr("disabled","disabled")

二、以下三种方法是移除（去除）掉input的disabled属性的方法

1、$(’#areaSelect’).attr("disabled",false)

2、$(’#areaSelect’).removeAttr("disabled")

3、$(’#areaSelect’).attr("disabled","")

三、移除或者删除改裤所有input和select控件的disabled属性

1、移除所有select控件的disabled属性

$("select").each(function () {$(this).attr("disabled","");})

2、移除所有input控件的disabled属性:
$("input").attr("disabled","");

扩展资料

1、jQuery是一个快速、简核羡简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery倡导写更少的代码，做更多的事情。它封装JavaScript常用派滚的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

2、disabled属性是控制这个控件是否可、可用。disabled:true 就是不可用，disabled:false 就是可用。