1

I know that there are plenty answers to this question on stackoverflow, but I can´t find one that give me an answer that can help me to solve a question that came out after read a lot of Javascript, JQuery articles and using those languages for several months.

Here is the deal:

Apparently, I can do a generic site that can charge a Dom dynamically, I read article that says that do this and adding element to the dom at the time the page is loading is dangerous, and use this on framework like Angularjs is almost a sin to think on angular as a jquery background.

So, with that in mind.

Why is such a big deal to make a Dom loading dynamically (input a Json File)?

And the finally Question is, there’s a right way to do it? Thanks in advance!

3
  • "Why is such a big deal to make a Dom loading dynamically (input a Json File)?" -- can you expand on that question a little? It's hard to tell what you're asking.
    – Hey
    Commented Jan 13, 2015 at 19:24
  • @Hey Yes, For sure, just think that you have a structure in which you have a definition of a Form with lots of inputs, textbox, checkbox and all those stuffs, but in this article link You can see in the first point that if you are using a framework like AngularJs you can't make the same that is used on Jquery and manage elements binding those dom elements, so why they give up and saying that Angularjs got not same paradigm as Jquery
    – dgnF
    Commented Jan 13, 2015 at 20:25
  • 1
    I think the point of that answer is just that if you're using Angular you shouldn't be modifying the document directly (with jQuery, vanilla JS, or anything else), you should be doing it the "Angular way." If you aren't using Angular, just remember to build up node trees and insert them into the document all at once instead of making many small changes to the document.
    – Hey
    Commented Jan 14, 2015 at 3:55

2 Answers 2

0

I think you should use jQuery when you manipulate an existing DOM. Of course with jQuery you can insert HTML snippets too, but i think its harder to separate the view from the js code in this way.

In Angular you define the view in HTML and the js code will make it workable.

I can summarise the main difference between the jquery and the angular way:

  • with jquery you manipulate DOM (and handle events)
  • with angular you define the view and the behavior
1
  • Thanks @blaskov that was what I read in some articles but I wasn't that actually this where the scope of this tow technologies.
    – dgnF
    Commented Jan 14, 2015 at 14:17
1

Just to give a quick and easiest example using jQuery:

<span id="main"></span>
<button onclick="add();">Click Me</button>

function add(){
$("#main").html("<h1>Hello</h1>");
}

The <span> will be populated with <h1>Hello</h1> on button click

You can run the above example here: http://jsfiddle.net/29mydshx/

2
  • Can you explain how this example of modifying a document answers the question? Are you saying this is the best way to do it?
    – Hey
    Commented Jan 13, 2015 at 19:29
  • Thanks @Saurabh Sharma But i what i was looking for a performance and stability way of do the dom manipulation.
    – dgnF
    Commented Jan 13, 2015 at 23:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.