How to make jQuery $ (element) .css () effects permanent?

For example, when using the font-size / button switch, if I use

    $('#container p').css('font-size', '24px');

it works as expected, but if I add paragraph elements to the container later (via ajax, etc.), they will not be in the style of the updated font size. I know that this is the intended behavior of the method .css(). I'm just asking:

What is the correct style change approach for the CSS selector and the persistence of these styles?

+3
source share
5 answers

That's right, well, when you execute this command, it pushes all the pelements in #container. If you want it to be permanent, you could create an element <style />and add CSS styles there.


, - :

$(document.head).append('<style>#container p{font-size: 24px;}</style>');
+4

jQuery , :

<div id='container'>
  <p style='font-size:24px'>a</p>
  <p style='font-size:24px'>b</p>
  <p style='font-size:24px'>c</p>
</div>

, , :

var stylesheets = document.styleSheets

styleSheet , insertRule, , () css.

!

+2

JavaScript, :

<div id="wrapper">
  <div id="paragraph1">blah</div>
  <div id="paragraph2">you</div>
</div>

$("#wrapper").css...

, , , ...

+2

, , jQuery .

+1

, , , .

If you enter through AJAX a replacement for #container, then all content will be destroyed and replaced with new content. All tags <p>that you added, the style will no longer exist, and it will need to be repeated in a new entry.

That you could try creating a class definition on the fly .

0
source

Source: https://habr.com/ru/post/1789395/


All Articles