在style标签上删除style属性

Question

我有一个带有html内容的字符串。我想通过javascript正则表达式来删除style标签上的style属性，就像这样：

修改前

<style style="color: red;">

修改后

<style>

你能帮我吗？

- EpokK

---

什么？样式标签对浏览器不可见。我的意思是它在页面上不会呈现出来。那么为什么你要在样式标签上使用样式属性呢？ - Akshay Khandelwal

这里肯定有一些缺失的信息。你为什么要那样使用<style>标签呢？该标签用于在文档内定义CSS规则... - Lix

我假设这是为了处理通过CMS提交的代码之类的东西。剥离不必要的属性。 - James Allardice

$("style").removeAttr("style"); 我希望这样做可以使用jQuery。 - codebreaker

Answer 1

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

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

echo $output;

输出结果将如下所示

<style> 

- Daya

---

这个函数不是JavaScript。 - Action Dan

好的，让它像这样的 JavaScript 代码：var input = ''，var output = input.replace()... - Iris Schaffer

Answer 2

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

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

如果那确实是DOM中的一个节点：

node.removeAttribute("style");

- James Allardice

Answer 3

如果我正确理解了你的问题，你想在JavaScript中处理带有HTML内容的字符串并删除其中的style属性，而不使用浏览器（即在Node环境中）。

你可以使用正则表达式来移除它们。可以只对所有具有style属性的标签进行操作：

// 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);

- Patrick

Answer 4

考虑以下内容：

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,'')

请参考此图以证明多行替换答案：

- Abhay Shiro

Answer 5

那是一种荒谬的使用方式<style>，但无论如何。您可以按照以下方式进行：

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

调试它，直到它能正常工作 http://jsfiddle.net/xabe7/

- Shikiryu

Answer 6

你在问题中加了一个“javascript”的标签。如果你想使用JavaScript或jQuery，已经有这个问题（并且有解决方案）： 通过JavaScript删除HTML元素样式 例如，给你的元素添加“id”或“class”，然后使用以下代码：

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

如果您正在使用jQuery，则可以这样做：

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

- zchpit