Remove Style Attribute from HTML Tags

Remove style attribute from HTML tags

The pragmatic regex (<[^>]+) style=".*?" will solve this problem in all reasonable cases. The part of the match that is not the first captured group should be removed, like this:

$output = preg_replace('/(<[^>]+) style=".*?"/i', '$1', $input);

Match a < followed by one or more "not >" until we come to space and the style="..." part. The /i makes it work even with STYLE="...". Replace this match with $1, which is the captured group. It will leave the tag as is, if the tag doesn't include style="...".

Remove style attribute on style tag

$input = '<style style="color: red;">';

$output = preg_replace('/(<[^>]+) style=".*?"/i', '$1', $input);

echo $output;

Output will be like this

<style>

How to remove style from <html>

You can do that by this code:

document.getElementsByTagName("html")[0].removeAttribute("style")

For example:

const themes = {
  dark: {
      '--athens-gray': '#121212',
      '--alabaster': '#1E1E1E',
      '--black': '#ffffff',
      '--white': '#000000',
  },
  light: {
      '--athens-gray': '#e9e8ec',
      '--alabaster': '#f8f8f8',
      '--black': '#000000',
      '--white': '#ffffff',
  },
};
function lighttheme() {
const theme = themes["dark"];
    for (var variable in theme) {
            document.documentElement.style.setProperty(variable, theme[variable]);
    };
}

function removeStyle(){
    document.getElementsByTagName("html")[0].removeAttribute("style");
}

:root {
  --athens-gray: #e9e8ec;
  --alabaster: #f8f8f8;
  --black: #000000;
  --white: #ffffff;
}

body {
background-color: var(--white);
}

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Settings</title>
    </head>
<body>
<button type="button" onClick="lighttheme();">Click Me!</button>
<button type="button" onClick="removeStyle()">Remove Style!</button>
</body>
</html>

Remove Style on Element

You can edit style with pure Javascript. No library needed, supported by all browsers except IE where you need to set to '' instead of null (see comments).

var element = document.getElementById('sample_id');

element.style.width = null;
element.style.height = null;

For more information, you can refer to HTMLElement.style documentation on MDN.

Remove Style tag in HTML

Regex should be

 style\s*=\s*('|")[^\1]*\1

Though I would use Htmlagilitypack

   HtmlDocument doc = new HtmlDocument();
   doc.Load(yourStream);
   var elementsWithStyleAttribute = doc.DocumentNode.SelectNodes("//@style");
   foreach (var element in elementsWithStyleAttribute)
   {
       element.Attributes["style"].Remove();
   }
   doc.Save();

How to strip Style Attributes from HTML Tags?

A very simple replace will probably do:

preg_replace( '/style=(["\'])[^\1]*?\1/i', '', $subject, -1 );

Hope this helps

Javascript - How to remove the style attribute from all <li> tags

function removeAttrByTagName(tagname, attribute)
{
    var elements = document.getElementsByTagName(tagname);
    var i;

    for(i = 0;  i < elements.length; i++)
    {
        elements[i].removeAttribute(attribute);
    };
}

Then you can use it like this removeAttrByTagName('li', 'style')

Live example.

Remove Style Attribute from HTML Tags