如何让 JQuery 访问我的 css 样式？

Question

I'm in my _Layout.cshtml page. I'm trying to manipulate my menu bar using css and jquery.

Here's what I'm trying to do.

<script type="text/javascript">
$(document).ready(function () {
    var varElement = document.getElementsByTagName("var");
    for (var i = 0; i < varElement.length; i++) {
        varElement[i].style.fontSize = ".75";
    }
});
</script>

My problem is when I get to varElement[i] . I expected to see style in my intellisense but style is not in the list of properties. The only items available in the intellisense list are:

Constructor
hasOwnProperty
isPrototypeOf
propertyIsEnumerable
toLocalString
toString
valueOf

How do I get JQuery to access my css style?

Answer 1

In jQuery you can set CSS style as below:

$('var').css('fontSize', .75)

$('body').css('background', '#f00');

Answer 2

You'll want to use the .css() method. I'm not sure how you're using the for loop in your example, but on the jsfiddle is an example that includes a simple for loop, and hopefully that is helpful.

var changeStuff = function(){
for(i=1;i<=2;i++){
$('#p'+i).css('font-size','3em');

} };

http://jsfiddle.net/6UtyN/1/