寻找一个等效于jQuery解决方案的javascript解决方案
我在页面上有几个按钮，我动态地试图改变颜色（背景）
我写了一个jQuery，它正在所有浏览器上工作，并根据传递给函数的CSS参数改变背景颜色。
我正在寻找一种更改按钮颜色的javascript方法，该方法应该适用于所有类似于以下jQuery实现的浏览器。
function apply_Color(iframe,CSSParams){ var buttonColor = CSSParams.buttonColor; var buttonHoverBackgroundColor = CSSParams.buttonHoverBackgroundColor; jQuery(iframe).contents().find('.search-button').css({ 'background': buttonColor, 'background-image': '-moz-linear-gradient(top,' + buttonColor + ' 0%,' + buttonColor + ' 100%)', /* FF3.6+*/ 'background-image': '-webkit-gradient(linear, left top, left bottom, color-stop(0%, ' + buttonColor + '), color-stop(100%, ' + buttonColor + '))', /* Chrome,Safari4+ */ 'background-image': '-webkit-linear-gradient(top, ' + buttonColor + ' 0%, ' + buttonColor + ' 100%)', /* Chrome10+,Safari5.1+ */ 'background-image': '-o-linear-gradient(top, ' + buttonColor + ' 0%, ' + buttonColor + ' 100%)', /* Opera 11.10+ */ 'background-image': '-ms-linear-gradient(top, ' + buttonColor + ' 0%, ' + buttonColor + ' 100%)', /* IE10+ */ 'background-image': 'linear-gradient(top, ' + buttonColor + ' 0%, ' + buttonColor + ' 100%)'/* W3C */ }); jQuery(iframe).contents().find('.p-search-button').hover(function() { jQuery(this).css ({ 'background': buttonHoverBackgroundColor , 'background-image': '-moz-linear-gradient(top,' + buttonHoverBackgroundColor + ' 0%,' + buttonHoverBackgroundColor + ' 100%)', /* FF3.6+*/ 'background-image': '-webkit-gradient(linear, left top, left bottom, color-stop(0%, ' + buttonHoverBackgroundColor + '), color-stop(100%, ' + buttonHoverBackgroundColor + '))', /* Chrome,Safari4+ */ 'background-image': '-webkit-linear-gradient(top, ' + buttonHoverBackgroundColor + ' 0%, ' + buttonHoverBackgroundColor + ' 100%)', /* Chrome10+,Safari5.1+ */ 'background-image': '-o-linear-gradient(top, ' + buttonHoverBackgroundColor + ' 0%, ' + buttonHoverBackgroundColor + ' 100%)', /* Opera 11.10+ */ 'background-image': '-ms-linear-gradient(top, ' + buttonHoverBackgroundColor + ' 0%, ' + buttonHoverBackgroundColor + ' 100%)', /* IE10+ */ 'background-image': 'linear-gradient(top, ' + buttonHoverBackgroundColor + ' 0%, ' + buttonHoverBackgroundColor + ' 100%)'/* W3C */ }); }); } 我尝试过javascript方式，没有运气; 请帮忙。 如果我的问题不明确，请发表评论。 我会编辑。 我正在寻找可以采用线性渐变按钮（背景颜色）的语法。
obj.style.backgroundColor["-webkit-linear-gradient"] = "blue"; obj.style.backgroundColor = "red";
根据MT0的想法，你可以只在iframe中添加一个样式表吗？
function applyCss(iframe,stylesheet_url){ var link = document.createElement("link") link.href = "style.css"; link.rel = "stylesheet"; link.type = "text/css"; iframe.document.body.appendChild(cssLink); }
[编辑]对于线性渐变，您应该使用背景图像而不是背景颜色并将值设置为css函数
obj.style.backgroundImage = "-webkit-linear-gradient(left,blue,blue)";
整个脚本：
function apply_Color(iframe,CSSParams){ var buttonColor = CSSParams.buttonColor; var buttonHoverBackgroundColor = CSSParams.buttonHoverBackgroundColor; var els = iframe.document.getElementsByClassName('.search-button'); for(var i = 0; i
只是预感，我尝试了以下方法：
（特别..）
target.style.background = "red"; target.style.background = "-moz-linear-gradient(top, blue, red)"; target.style.background = "-webkit-linear-gradient(top, green, red)"; target.style.background = "-o-linear-gradient(top, black, red)";
尝试每个浏览器 – 它们都显示适当的渐变。 我的假设是，与样式表非常相似，忽略了无效值。 我意外地炸毁了我的IE安装，但这确实适用于chrome，opera（虽然它默认为opera 18中的webkit版本）和FF。 如果在我修复安装后这在IE上不起作用，我很乐意删除这个答案。
你的语法是关闭的：
obj.style.backgroundColor = 'blue'
在这里小提琴