Remove background style in all html tags using javascript
Question
How can I remove all background="..." in all HTML tags? I understood that it's not a good idea to try parsing HTML with regexes, but I don't know any over way. (tried regex "background([\\s\\S]*?)(;|\\")" - doesn't work). Thanks.
4 answers
solution1
2 ACCPTED 2015-01-12 12:56:31
By simple script you can use this code,
<script>
var allElements = document.childNodes;
for (var i = 0; i < allElements.length; i++)
{
var currElement = allElements[i];
if (currElement.hasAttribute("background"))
{
currElement.removeAttribute("background");
}
}
</script>
and to solve your mentioned issue,
use this,
use this to solve this issue,
`<script>
function removeBackground(cElement) {
var allElements = cElement.childNodes;
if (allElements.length > 0) {
for (var i = 0; i < allElements.length; i++) {
var currElement = allElements[i];
if (currElement.childNodes.length > 0) {
removeBackground(currElement);
}
if (currElement.hasAttribute("background")) {
currElement.removeAttribute("background");
}
}
}
}
removeBackground(document);
</script>`
solution2
1 2015-01-12 12:53:23
$(document).ready(function(){ $('*').removeAttr('background'); });
<!DOCTYPE html> <html> <body background="https://www.google.co.in/images/srpr/logo11w.png"> <h1>Hello world!</h1> <p>The background attribute is not supported HTML5. Use CSS instead.</p> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </body> </html>
You can use jquery to remove all background property like,
$('*').removeAttr("background");
solution3
0 2015-01-12 12:50:47
With jQuery you can use a simple selector for that:
$("*").css('background', 'transparent');
background attribute instead of style:
$("*").removeAttr('background');
Without jQuery it's a bit more work to do:
var elements = document.getElementsByTagName("*");
for (var i = 0, i < elements.length; i++) {
elements[i].style.background = "transparent";
}
Raw background attribute:
var elements = document.getElementsByTagName("*");
for (var i = 0, i < elements.length; i++) {
if (elements[i].hasAttribute("background")) {
elements[i].removeAttribute("background");
}
}
solution4
0 2015-01-12 13:03:08
You could add a custom sheet to override the background property like this
var style = document.createElement('style');
document.head.appendChild(style);
// Depend on browser implementation
if (style.sheet.insertRule) {
style.sheet.insertRule("* { background:none !important }", 0);
}
else if (style.sheet.addRule) {
style.sheet.addRule("*","background:none !important", 0);
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.