0

Often I find that as I manipulate the DOM and inject AJAX content, I fill the AJAX content into some copy+pasted HTML fragment, populate it with the new content and then simply $().html() the new code into the DOM... example below illustrates it simply.

$.post(url, {"input1": "postval1", "input2": "postval2"}, function (r) {
if (r.data != undefined) {
    $("#element_id").html("<div class='class_a class_b class_c' id='some_id'><a href='" + r.data.href + "'><img src='" + r.data.src + "' /></a></div>");
}}, 'json');

Though it always works great for me, I wonder if this is the most efficient way (least work to browser/quickest) and if it is a standard procedure across the industry?

EdNdee
  • 745
  • 1
  • 10
  • 18

1 Answers1

0

Never repeat yourself I would say, most MVC frameworks do work with generated HTML most of the time. It really is a preference. Honestly I would go for the normal static route where I would just generate the content that just needs generated and hang it on a specific class or id. This of course will require more thinking work and the benefits aren't that tremendous of course.

Really is a preference thing. Also since you are generating the code and call to action, you might want to target your buttons with the .on('event', 'target', 'function') way.

Maybe it would help your decision if you tend to tailor your product to non-js browsers and or screen-readers.

Happy Coding :)

Oz Lodriguez
  • 965
  • 5
  • 16
  • OK. I find the W3C DOM manipulation way too bloated especially if the code fragment, like in my case, is quite complex. I'll stick to the generated HTML. – EdNdee Feb 24 '14 at 14:29