Rimozione degli attributi dei dati da HTML usando jQuery

Question

Non riesco a far funzionare questo ...

Ho una pagina che nasconde determinati collegamenti. Quando il DOM viene caricato, sto usando jQuery per attivare alcuni di questi elementi. Questo è azionata mediante un attributo dati in questo modo:

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

Poi, Ho il codice:

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

Il soprattutto opere come previsto. Il problema è che sto cercando di rimuovere i dati-usr dalla classe .d_btn dopo aver valutato l'istruzione if. Ho provato quanto segue e non funziona niente (vale a dire, dopo che la pagina viene caricata, la fonte indica ancora l'attributo data-usr:

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

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

Ho lavorato su questo per un paio di ore e. ..nothing! aiuto è molto apprezzato!

UPDATE

ho provato i suggerimenti grandi del impostando l'attributo di dati su una stringa vuota, ma io non sono ancora ottenere il risultato desiderato.

a spiega un po 'oltre, il motivo per cui sto cercando di rimuovere l'attributo è così quando una risposta ajax aggiunge un altro elemento alla pagina, gli elementi aggiunti in precedenza avrebbero già mostrato o nascosto il pulsante. Sulla risposta AJAX, sto chiamando la stessa funzione una volta che il DOM è stato caricato.

Attualmente, quando si aggiunge qualcosa tramite la tecnologia AJAX, esso commuta tutti i pulsanti (che mostrano quelli che erano nascoste e viceversa.) Ugh ...

Sono anche pienamente disposto a provare alternative per il mio approccio . Grazie!

UPDATE

Beh, la lampadina solo lampo e sono in grado di fare quello che voglio fare da solo utilizzando .Show() al posto di .toggle()

In ogni caso, Mi piacerebbe comunque trovare una risposta a questa domanda perché la pagina potenzialmente potrebbe controllare centinaia di elementi ogni qualvolta viene aggiunto qualcosa - questo sembra orribilmente inefficiente (anche per un computer, hahaha.)

Answer 1

La modifica del DOM non influenza la sorgente. Influisce sul DOM, che puoi visualizzare con Inspector/Developer Tools. Clic con il tasto destro del mouse => Visualizza sorgente ti darà la fonte originale della pagina, non la sorgente attuale attuale modificata da JavaScript.

Answer 2

Perché non impostare il valore di un valore casuale o di una variabile vuota in grado invece se removeAttr non funziona ..

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

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

Answer 3

Set in una stringa vuota:

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

ho secondo quello che ha detto Kolink: controllare il DOM, non la fonte. (Chrome: Ctrl + Shift + i).

Answer 4

Come altri hanno affermato. Controllando la fonte mostrerà solo la sorgente originale non modificata per la pagina web. Quello che devi fare è controllare il DOM usando gli strumenti di sviluppo.

Ho appena controllato tutto nell'ispettore di Chrome su jsfiddle here e l'attributo è stato definitivamente rimosso così come i dati.