使用jQuery从HTML中删除数据属性

Question

似乎无法让这个工作......

我有一个隐藏某些链接的页面.当加载DOM时,我正在使用jQuery来切换其中的一些元素.这是通过使用如下数据属性来驱动的:

<div class="d_btn" data-usr='48'>
  <div class="hidden_button">

然后,我有代码:

  $.each($(".d_btn"), function() {
     var btn = $(this).data('usr');
   if ( btn == '48' ){      
     $(this).children('.hidden_button').toggle();
   }

以上都按计划进行.问题是,一旦if语句被评估,我试图从类.d_btn中删除data-usr.我已经尝试了以下内容并且没有任何作用(即,在加载页面之后,源仍然显示data-usr属性:

$(this).removeAttr("data-usr");

$(this).removeData("usr");

我已经在这个问题上工作了几个小时而且......没什么!非常感谢帮助!

UPDATE

我已经尝试了将数据属性设置为空字符串的好建议,但我仍然没有得到所需的结果.

为了进一步解释,我试图删除属性的原因是当ajax响应向页面添加另一个项目时,之前添加的项目已经显示或隐藏了按钮.在AJAX响应时,我在加载DOM后调用相同的函数.

目前,当通过AJAX添加某些内容时,它会切换所有按钮(显示隐藏的按钮,反之亦然.)呃......

我也完全愿意尝试替代我的方法.谢谢!

UPDATE

嗯,灯泡刚刚闪过,只需使用.show()而不是.toggle()就可以做我想做的事情.

无论如何,我仍然想找到这个问题的答案,因为无论什么时候添加东西,页面都可能会检查数百个项目 - 这看起来非常低效(即使是电脑,哈哈哈.)

Answer 1

更改DOM不会影响源.它会影响DOM,您可以使用Inspector/Developer Tools查看它.右键单击=>查看源将为您提供页面的原始来源,而不是JavaScript修改的实际当前源.

Answer 2

如果removeAttr不起作用,为什么不将值设置为随机值或空变量.

$(this).attr("data-usr" , '');

$(this).prop("data-usr" , '');