How to define multiple CSS attributes in JQuery?
Is there any syntactical way in JQuery to define multiple CSS attributes without stringing everything out to the right like this:
$("#message").css("width", "550px").css("height", "300px").css("font-size", "8pt");
If you have, say, 20 of these your code will become hard to read, any solutions?
From jQuery API, for example, jQuery understands and returns the correct value for both
.css({ "background-color": "#ffe", "border-left": "5px solid #ccc" })
and
.css({backgroundColor: "#ffe", borderLeft: "5px solid #ccc" }).
Notice that with the DOM notation, quotation marks around the property names are optional, but with CSS notation they're required due to the hyphen in the name. – zanetu S
better to just use .addClass even if you have 1 or more. More maintainable and readable.
If you really have the urge to do multiple css props then use
NB Any css props with a hyphen need to be quoted.
.css({
'font-size' : '10px',
'width' : '30px',
'height' : '10px'
});
I've placed the quotes so no one will need to clarify that, and the code will be 100% functional.
pass it a json object:
$(....).css({
'property': 'value',
'property': 'value'
});
http://docs.jquery.com/CSS/css#properties
$('#message').css({ width: 550, height: 300, 'font-size': '8pt' });
下一篇: 如何在JQuery中定义多个CSS属性？