JQuery and dynamic elements versus css attribute

When developing html interface elements, this is a fairly common script that shows / hides the DOM depending on certain events. My question is simple, but every time I come across this, I always ask myself: “It is better” to have elements that are hardcoded in html and just switch the display attribute (for example, with .show / .hide) or dynamically add / remove them as needed through js? Both are trivial to implement, but I can't help but wonder how they compare and if there is an advantage / disadvantage to using one over the other.

There are cases, for example, when the same element is used literally in several places, where it seems to make sense to create dynamically dynamically as you go, but, on the other hand, hard coding them is theoretically more convenient, since you you can move the DOM around and change them as needed, and they will work as expected, as long as the selector is still the same for jQuery. Generally speaking, from a design approach it seems that hard coding is the way to go, but I look forward to thoughts and, possibly, things that I can ignore here.

Edit: "hardcoded" I meant elements that were not inserted through JS; that is, elements that have their own position, already indicated in their parent document, in the original html markup, and not in JS.

+4
source share
2 answers

Ultimately, it really depends on what you are working with and what your application is doing, but:

  • Static markup means a lot of work for the server (but only if the page is generated dynamically in the first place, for static pages the effect is negligible).

  • Dynamic markup means a lot of work for the client, which is not always bad, depending on your target audience.

Technically, Elegant degradation assumes that static markup is the way to go, since ideally the page should remain functional when scripts are turned off (dynamic markup is an optional layer above the working static core).

, Progressive Enhancement , , , , .

, jQuery UI jQuery Mobile , , .

, , , . , , , , .

+2

, , , . DOM . DOM . DOM-, DOM. , , . .

+2

All Articles