Geek Answers Handbook

What is the difference between $ (element) .append () and element.insertAdjacentHTML

which have better performance?

House

element.insertAdjacentHTML('afterend', '<div id="two">two</div>');

Jquery

  $(element).append('<div id="two">two</div>')
+4
source share
1 answer

Well, if you are not targeting older than Chrome 1.0 , Firefox 8.0 , IE 4.0 , Opera 7.0 or Safari 4.0 , it is safe to use insertAdjacentHTML . jQuery can resolve any browser inconsistencies that may occur, but this operation also requires a whole library. If you are already using jQuery, stick with jQuery methods. If you are not using jQuery and are wondering, it would be useful to start using it only for this method, then do not worry.

In terms of “better”, as I said, it should either be sufficiently consistent / reliable in browsers, but insertAdjacentHTML is its own DOM method, which is straight to the point and does not require additional code (for example, using jQuery) ... means that it should be "faster."

.append() accepts several types of parameters (HTML string, DOM element, jQuery object or even arrays / object literals containing these things) ... and inside, .append() uses Element.appendChild . insertAdjacentHTML only accepts an HTML string.

Based on this, it may or may not affect your decision.

Literature:

+4
source

More articles:


All Articles