[英]Javascript / jQuery change inline style values
I have an inline css in my page: 我的页面中有一个内联css:
<style id="abc">
.player-holder{
position:relative;
width:100%;
height:40px;
}
.icon-color{
color:#fff;
-webkit-transition: color 0.3s ease-in-out;
transition: color 0.3s ease-in-out;
}
.icon-rollover-color{
color:#fff;
-webkit-transition: color 0.3s ease-in-out;
transition: color 0.3s ease-in-out;
}
</style>
Is it possible to change some values on the fly (using jquery/javascript) so that browser takes change immediately? 是否可以动态更改某些值(使用jquery / javascript),以便浏览器立即更改?
Like change: 喜欢改变:
.icon-rollover-color
.icon侧翻色
to 至
color:#333;
颜色:#333;
in jquery 在jquery
<script>
$('.icon-rollover-color').css({
'color': '#333'
});
</script>
in javascript 在javascript中
<script type="text/javascript">
document.getElementByClassName(".icon-rollover-color").style.color="#333"
</script>
你可以通过使用简单的jquery来做到这一点。
$('.icon-rollover-color').css('color','red')
Yes, you can change inline CSS using the jquery .css() function. 是的,您可以使用jquery .css()函数更改内联CSS。 See this Fiddle .
看到这个小提琴 。
$('p').css('color','#00FF00');
If you are dynamically adding elements then I would suggest you write this as a function that is called whenever a new element is added, probably using an event listener, that you can pass your updated style values to as parameters. 如果你是动态添加元素,那么我建议你把它写成一个函数,每当添加一个新元素时调用它,可能使用一个事件监听器,你可以将更新的样式值作为参数传递。 Something like:
就像是:
updateDOMStyle('<style>','<value>');
You, indeed this is possible! 你,确实这是可能的!
Just add via Javascript or jQuery the following style
-tag on the bottom of your page. 只需通过Javascript或jQuery添加页面底部的以下
style
标签即可。
<style type="text/css">
.icon-rollover-color {
color:#333!important;
}
</style>
You can add such codes to the bottom before the body
-tag closes with the append
-command: 您可以在使用
append
-command关闭body
-tag之前将此类代码添加到底部:
$(body).append('<style type="text/css">.icon-rollover-color {color:#333!important;}</style>');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.