Home >Web Front-end >CSS Tutorial >Why Isn't My jQuery CSS Modification Working?

Why Isn't My jQuery CSS Modification Working?

Susan Sarandon
Susan SarandonOriginal
2024-12-05 20:37:14852browse

Why Isn't My jQuery CSS Modification Working?

Changing CSS with jQuery

In an attempt to modify CSS elements using jQuery, the code provided seems to lack a crucial element. The jQuery API states that CSS properties can be specified using both quoted and unquoted notation.

Inspecting the code closely, the issue lies in a missing closing curly brace. The line:

$("#myParagraph").css({"backgroundColor":"black","color":"white");

should have an additional curly brace to close the object literal:

$("#myParagraph").css({ "backgroundColor": "black", "color": "white" });

With this correction, the code behaves as intended, altering the styles of the HTML elements:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="bordered">
  <h1>Header</h1>
  <p>
$(init);

function init() {
  $("h1").css("backgroundColor", "yellow");
  $("#myParagraph").css({ "backgroundColor": "black", "color": "white" });
  $(".bordered").css("border", "1px solid black");
}

The above is the detailed content of Why Isn't My jQuery CSS Modification Working?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn