En este artículo, veremos cómo agregar algunas propiedades CSS de forma dinámica usando jQuery. Para agregar propiedades CSS dinámicamente, usamos el método css(). El método css() se usa para cambiar la propiedad de estilo del elemento seleccionado.
El método css() se puede usar de diferentes maneras. Este método también se puede utilizar para comprobar el valor actual de la propiedad para el elemento seleccionado:
Sintaxis:
$(selector).css(property)
Aquí hemos creado dos elementos dentro de la etiqueta del cuerpo, es decir, los elementos <h1> y <h3>. Aplicamos la propiedad CSS en la etiqueta <body> y la etiqueta <h1> usando el método css() dinámicamente.
Ejemplo:
HTML
<!DOCTYpe html>
<html>
<head>
<title>
How to add CSS properties to an
element dynamically using jQuery?
</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function () {
$("body").css("text-align", "center");
$("h1").css("color", "green");
});
</script>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h3>
How to add CSS properties to an element
<br>dynamically using jQuery?
</h3>
</body>
</html>
Producción:
