jQuery changes the basic code of CSS style_jquery

One of them accepts two input parameters: style attribute and style value, separated by commas. For example, if we want to change the link color, we can use the following code:

Copy the code The code is as follows:

$("#61dh a").css('color','#123456');
//The selector '$("#61dh a")' here represents the element with the ID '#61dh' All links below.
//.css('color','#123456'); means setting the color to '#123456'

If we need to change multiple style attributes, we can define the attributes first variable, and then assign it directly to the css() method. The example is as follows:

Copy code The code is as follows:

var divcss = {
background: '#EEE',
width: '478px',
margin: '10px 0 0',
padding: '5px 10px',
border: '1px solid #CCC'
} ;
$("#result").css(divcss);
//Here we first define a CSS style attribute variable 'divcss', which is similar to creating an external CSS file.
//Then use the css() method provided by jQuery to assign the attribute to the DIV with the ID '#result'.

In addition, the css() method provided by jQuery can also be used to view the css attribute value of an element. For example, if we want to see the color of the link, we can use the following code:

Copy the code The code is as follows:

$("#61dh a").css("color")
//Similar to the first example, but here we only pass one parameter (style attribute)

The last thing I want to introduce is how to set the link style (for example: color) after the mouse is crossed. We cannot use the selector to directly select the link in the mouse-over state, which means $("a:hover") is not valid. Therefore we need to use the event class method provided by jQuery - hover(). It is worth noting that the hover() method needs to define two functions, one when the mouse moves over; the other after the mouse moves over. The specific method is as follows:

Copy the code The code is as follows:

$("#61dh a") .css('color','#123456');
$("#61dh a").hover(function(){
$(this).css('color','#999') ;
},
function(){
$(this).css('color','#123456');
});
//Two ways of hover() method Functions are separated by commas

You may notice that this method is not concise at all (contrary to the purpose of jQuery),
In fact, the hover() method provided by jQuery is not used to change CSS style. In practical applications, it is recommended to use the method of adding/removing CSS to change the link style when the mouse is crossed.