使用Javascript删除HTML中的背景色和字体颜色

我正在改进TinyMCE编辑器，希望在前景色和后景色中添加按钮默认颜色。这就是我如何获得背景色随机样式的选定文本：

outer = tinyMCE.activeEditor.selection.getNode().outerHTML;

例如，可能有这样的情况：

<p style="font-size: 18px;"> 
    sadasdasdsasdasda
    <span style="background-color: rgb(0, 255, 0);" data-mce-style="background-color: #00ff00;">sdasdasda</span>
    <span style="background-color: rgb(255, 0, 0);" data-mce-style="background-color: #ff0000;">
        <span style="background-color: rgb(0, 255, 0);">sdasd</span>
        asdasdasdas
    </span>
    dasdasd
</p> 

我不精通Javascript，也不精通jQuery。我怎样才能从

外部

中删除所有

背景色

$("*").each(function () {
    $(this).css('background-color', 'transparent');
});

编辑

 var a='<p style="font-size: 18px;">sadasdasdsasdasda<span style="background-color: rgb(0, 255, 0);" data-mce-style="background-color: #00ff00;">sdasdasda</span><span style="background-color: rgb(255, 0, 0);" data-mce-style="background-color: #ff0000;"><span style="background-color: rgb(0, 255, 0);">sdasd</span>asdasdasdas</span>dasdasd</p>';
var outer=$(a);
outer.find("*").css('background-color','transparent');
$("div").append(outer);

变量a='

sadasdasdasdasdasdasdasd

； var外部=$（a）； outer.find（“*”）.css（'background-color'，'transparent'）； $（“div”）。追加（外部）；

---

需要的只是插件中的编辑功能（

plugins/textcolor/plugin.js

）。那么结果将是：

function onPanelClick(e) {
   var buttonCtrl = this.parent(), value;

   if ((value = e.target.getAttribute('data-mce-color'))) {
      buttonCtrl.hidePanel();
      buttonCtrl.color(value););
      if (value == 'transparent') {
         tinyMCE.execCommand("RemoveFormat");
      } else {
         editor.execCommand(buttonCtrl.settings.selectcmd, false, value);
      }
   }
}

之后，还需要编辑

tinymce.js

。只需编辑器

removeformat

，例如：

removeformat: [
   {selector: 'span', styles: ['background-color'], remove: 'empty', split: true, expand: false, deep: true}
]

（对于其他用户）若要向面板添加新颜色，请在函数

renderColorPicker（）

中插入此代码，建议在循环之前：

function renderColorPicker() {
   ...

   html += '<tr>';
   html += (
      '<td colspan="' + cols + '">' +
         '<div id="' + ctrl._id + '-00" class="color-box"' +
         ' data-mce-color="transparent"' +
         ' role="option"' +
         ' tabIndex="-1"' +
         ' style="background-color: transparent"' +
         ' title="Default color">' +
         '<span>Default color</span></div>' +
      '</td>'
   );
   html += '</tr>';

   for (y = 0; y < rows; y++){
   ...

函数renderColorPicker（）{
...
html+=''；
html+=(
'' +
'' +
“默认颜色”+
''
);
html+=''；
对于（y=0；y

您可以在jquery中使用添加和删除类。您必须存储特定类的css属性，例如class:

。transparentText

包含空颜色，然后单击add class？这会起作用，但当用户选择其他文本时，旧文本将在选中的

new

文本中，它会起作用吗为此创建一个tinymce提琴？（fiddle.tinymce.com）我将尝试“克隆”它，但我不这么做。这是公司的项目，这个编辑器被编辑了很多次，现在我们需要整合这个，我的任务是什么。但这将改变整个文档中的每个背景颜色。我只需要改变所选文本的背景颜色，存储在外部变量中的内容。很抱歉，回复晚了，我正在吃午饭。现在这似乎更好，我会尝试将它应用到我的脚本中。当它起作用时，我会接受你的答案。看看我自己的答案，我终于找到了解决方案。

function renderColorPicker() {
   ...

   html += '<tr>';
   html += (
      '<td colspan="' + cols + '">' +
         '<div id="' + ctrl._id + '-00" class="color-box"' +
         ' data-mce-color="transparent"' +
         ' role="option"' +
         ' tabIndex="-1"' +
         ' style="background-color: transparent"' +
         ' title="Default color">' +
         '<span>Default color</span></div>' +
      '</td>'
   );
   html += '</tr>';

   for (y = 0; y < rows; y++){
   ...