如何使用jquery更改页面的内联样式 [英] how to change the inline style of the page using jquery

查看:1554
本文介绍了如何使用jquery更改页面的内联样式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在我的网页中有一个内联样式:

 < head& 
< meta http-equiv =Content-Typecontent =text / html; charset = utf-8/>
< title> ::内联样式页面::< / title>
< style type =text / css>
<! -
body
{
background:#fff;
font:normal 12px Tahoma,Verdana,Arial;
color:#636363;
}
#header
{
height:60px;
}
#menu
{
background:#fff;
height:30px;
}
#footer
{
height:50px;
background:#fff;
}
- >
< / style>



我需要更新或添加一些样式使用jquery的内联样式。



我想使用jquery更新页面/ divs /控件的字体,背景颜色。我将有我的内联样式(从数据库加载)为我的页面内容的样式。我的应用程序的用户可以更改一些样式并将其更新回数据库。



它几乎像创建自定义页面应用程序(asp.net mvc in c#)。 p>

如何使用jquery更改页面的内联样式?或者是否有任何其他有效的方法来完成此操作?

解决方案

尝试 jQuery.Rule



然后你会这样做:

  $。rule('body {backgound-color:#ff0000}')appendTo('style'); 

将身体的背景颜色更改为眼睛红色。



如果你只是想添加或覆盖特定的东西,你可以使用普通的jQuery添加一个 style 属性到基于id / class的特定元素:

  //添加到id =foo的元素
$('#foo')。attr style,{backgroundColor:#ff0000})
//使用class =bar添加到所有元素
$('。bar')。attr #ff0000})


I have an inline styles in my page as :

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>:: Inline Style Page ::</title>
<style type="text/css">
    <!--
    body
    {
        background: #fff;
        font: normal 12px Tahoma, Verdana, Arial;
        color: #636363;
    }
    #header
    {
        height: 60px;
    }
    #menu
    {
        background: #fff;
        height: 30px;
    }
    #footer
    {
        height: 50px;
        background: #fff;
    }
    -->
</style>

I need to update or add some styles to the inline styles using jquery..

I am trying to update the font, background color of the page/divs/controls using jquery. I will have my inline styles (loaded from database) for the style of my page content. My application's user can change some of the styles and update it back to the database.

Its almost like creating custom page application(asp.net mvc in c#).

How can i change the inline styles of the page using jquery? or is there any other effective way to do it?

解决方案

Try jQuery.Rule

Then you would do:

$.rule('body { backgound-color: #ff0000 }').appendTo('style');

to change the background-color of the body to eye burning red.

If you just want to add or override specific things you can use regular jQuery to add a style attribute to specific elements based on id/class:

// add to element with id="foo"
$('#foo').attr("style", {backgroundColor: "#ff0000"}) 
// add to ALL elements with class="bar"
$('.bar').attr("style", {backgroundColor: "#ff0000"}) 

这篇关于如何使用jquery更改页面的内联样式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆