<!DOCTYPE html>
<html>
<head>
<style>
p { color:red; text-align:center; cursor:pointer;
font-weight:bolder; width:300px; }</style>
<script src="http://code.jquery.com/jquery...
</head>
<body>
< ;p>Click here</p>
<p>to iterate through</p>
<p>these ps.</p>
<script>
$(document.body).click(function () {
$( "p" ).each(function (i) {
if ( this.style.color != "blue" ) {
this.style.color = "blue";
} else {
this.style.color = "";
}
});
});</script>
</body>
</html>
The value of this.style.color in the code should not be obtained, right? Because the style in the style tag cannot be obtained, but the program changes color during normal operation, can you explain why?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
https://developer.mozilla.org...
this.style.color is an empty string and satisfies the following conditions
So the color will still change when you click it
When
styleis not set using a DOM object, the value ofthis.style.colorshould be an empty string:"", sothis.style.color != "blue"this expression The value of should betrue.