All relevant data attributes are selected and deleted.

Question

I am trying to find a way to remove from the page all the relevant data attributes from different elements.

Now I loop the array, but the list of names is long, so I hope there is a better way to remove my user data attributes ..... with a regex pattern?

//code

var dataArr = ['data-myplugin-value', 'data-myplugin-id', ... ... ... ... 'data-myplugin-name']; $.each(dataArr, function(i,a){ $('['+a+']').removeAttr(a); }); 

Answer 1

If you don't mind using XPath, here is my solution:

 function removeMyDataAttributes() { var list, iterator, attribute, i, n; // Select all attribute nodes that it name starts with "data-myplugin-" iterator = document.evaluate('//*/attribute::*[starts-with(local-name(), "data-myplugin-")]', document.documentElement, null, XPathResult.ANY_TYPE, null); list = []; while ((attribute = iterator.iterateNext())) { list.push(attribute); // Note: can't call removeAttributeNode here: // InvalidStateError: Failed to execute 'iterateNext' on 'XPathResult': The document has mutated since the result was returned. } for (i = 0, n = list.length; i < n; ++i) { attribute = list[ i ]; attribute.ownerElement.removeAttributeNode(attribute); } } 

Answer 2

If the elements have a common parent element, you can narrow your search to this element:

 var holder = $('#containerid'); $.each(dataArr, function(i,a){ $('['+a+']', holder).removeAttr(a); }); 

There is some code in this SO topic using the attributes collection, but I'm not sure if this will be more efficient.

Answer 3

Do you think that what you wrote above will work? You treat dataArr as DOM elements, which is wrong. JQuery will not be able to find

$ ('[' + a + ']') removeAttr (a).

as "a" does not refer to an element.

Now, on how to solve it, I need one help - these data attributes are placed from jquery or part of html 5. If it is through jquery, you can use

http://api.jquery.com/jquery.removedata/.

It will work. Therefore, we iterate over all the DOM elements and call removeData (). Not the best solution, but it will work.

Answer 4

 Loop through the array and remove all data attributes $.each(dataArr, function(i,a){ removeDataAttributes('[+a+]'); }); // removes all data attributes from a target element // example: removeDataAttributes('#user-list'); function removeDataAttributes(target) { var i, $target = $(target), attrName, dataAttrsToDelete = [], dataAttrs = $target.get(0).attributes, dataAttrsLen = dataAttrs.length; // loop through attributes and make a list of those // that begin with 'data-' for (i=0; i<dataAttrsLen; i++) { if ( 'data-' === dataAttrs[i].name.substring(0,5) ) { // Why don't you just delete the attributes here? // Deleting an attribute changes the indices of the // others wreaking havoc on the loop we are inside // b/c dataAttrs is a NamedNodeMap (not an array or obj) dataAttrsToDelete.push(dataAttrs[i].name); } } // delete each of the attributes we found above // ie those that start with "data-" $.each( dataAttrsToDelete, function( index, attrName ) { $target.removeAttr( attrName ); }) };