删除样式标签上的样式属性答案

【问题标题】：Remove style attribute on style tag删除样式标签上的样式属性
【发布时间】：2013-10-21 19:00:38
【问题描述】：

我有一个包含html 内容的STRING。我想使用 javascript 正则表达式删除 style 标记上的 style 属性，如下所示：

之前

<style style="color: red;">

之后

<style>

你能帮帮我吗？

【问题讨论】：

什么？？样式标签对浏览器不可见。我的意思是它不会在页面中呈现。那么为什么你会在 style 标签上有 style 属性呢？
这里肯定有一些缺失的信息。你为什么要这样使用<style> 标签？该标签用于定义文档中的 CSS 规则...
我假设这是为了处理通过 CMS 提交的代码之类的东西。去除不必要的属性。
$("style").removeAttr("style");我希望如果使用 jquery 会这样做..

标签： regex

【解决方案1】：

假设你在一个字符串中有它（这是一个非常基本的例子，它不会处理例如属性值中的转义引号）：

str = str.replace(/style="[^"]*"/, "");

如果这实际上是 DOM 中的一个节点：

node.removeAttribute("style");

【讨论】：

【解决方案2】：

您在问题中添加了标签“javascript”。如果你想使用 javascript 或 jQuery，已经存在这个问题（有解决方案）：

removing html element styles via javascript

例如，给你的元素 'id' 或 'class' 并使用：

getElementById("id").removeAttribute("style");

如果你使用的是 jQuery，那么

$("#id").removeClass("classname");

【讨论】：

【解决方案3】：

这是一种使用<style> 的荒谬方式，但无论如何。你可以这样做：

var styles = document.getElementsByTagName('style');
for ( var i = 0, l = styles.length; i < l ; i++ ){
    styles[i].removeAttribute('style');
}

拨弄它http://jsfiddle.net/xabe7/

【讨论】：

【解决方案4】：

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

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

echo $output;

输出会是这样的

<style>

【讨论】：

这个函数不是javascript。
好吧，把 javacript 改成这样：var input = '', var output = input.replace()...

【解决方案5】：

如果我正确理解了您的问题，您希望在不使用浏览器的情况下使用 Javascript 去除具有 HTML 内容的字符串中的样式属性（即在 Node 环境中）。

您可以使用 RegEx 删除它们。要么只对所有具有样式属性的标签执行此操作：

// For all tags:
myString = '<style style="color: red;">';
myString = myString.replace(/(<[^>]+) style=".*?"/ig, '$1');
console.log(myString);

或者只是带有样式属性的样式标签：

// For style tags only:
myString = '<style style="color: red;">';
myString = myString.replace(/(<style[^>]*) style=".*?"/ig, '$1');
console.log(myString);

【讨论】：

【解决方案6】：

考虑以下几点：

var testHtmlString = '<p style="color: rgb(0, 0, 0); font-family: "Times New Roman";"></p>';
var regex = /style=".*?"\S"/

试试testHtmlString.replace(regex, '')

希望这会有所帮助。

请参阅此图片以获取答案证明

如果存在多行 HTML，例如您有大量 HTML 需要删除其内联样式，请使用以下 -

testHtmlMultilineString.replace(/style=".*?"/mg,'')

请参阅此图片以获取多行替换答案的证明：

【讨论】：