Adding elements to the DOM - The Diigo Meta page

• 02 Apr 13
  

  Gene Lyman

  javascript DOM

• 26 Jul 11
  

  Miguel Cardoso

  programming imported

• 19 Jun 11
  

  jason smith

  cur2b dom

  • Adding a new element to a document is very logical. The first step is to create the node   (element) you wish to append, the   next is to find where you wish to append it within the document, and the final step is to   actually do the appending. A node is the representation of either a piece of   text or a tag and its attributes in the DOM, and will be referred to often   on this tutorial. The syntax for creating a node is very simple - you just   call a method of the document object. To create a text node, we use the createTextNode() method of the document   object. document.createTextNode(Text) returns a node   with the given text in it. Here is an example use of it:

  • Once the node you wish to add has been created, you must locate where you   wish to append it in the document tree. The document tree   is the representation of all tags, attributes, and text (all nodes) in the   Document Object Model. To locate the place in the document tree we wish to   append our new node to, we have a choice. You may either assign an ID to the   place in the document you wish the new node to be inserted, or navigate the   document tree by use of children and parents. This will be discussed later.   To use an ID to locate where we wish to append our new node we use document.getElementById(). This will return   the object (whether it be a DIV, P, SPAN, etc..) with the given ID. For   instance, to access the DIV with the ID "myDiv", we would use:

     

    document.getElementById(
• 28 Apr 11
  

  Lance Grigsby

  dom javascript dhtml

• 07 Mar 11
  

  AnandavelMurugan Chandramohan

  javascript dom tutorial reference

• 18 Jan 11
  

  haltersweb

  var link = document.createElement('a');

  jquery javascript add element object dom

  • Adding elements to the DOM
  • var link = document.createElement('a');
• 03 Nov 10
  

  arthur paul

  javascript

• 01 May 10
  

  joec0914

  javascript tutorial programming howto ajax reference dom delicious

• 03 Mar 10
  

  Emmanuel Di Pretoro

  DOM JavaScript

• 17 Jul 09
  

  Erik Berg

  DOM webdev javascript

• 25 Jun 09
  

  webjan0

  Web programming

• 16 Feb 09
  

  Scott Centurino
• 10 Sep 08
  

  Shiki Shiji

  dom adding elements

  Bookmarks javascript tutorials

• 21 Jul 08
  

  Andres Pineda
• 11 Jun 08
  

  mikesterific

  javascript child

• 14 Apr 08
  

  gialloporpora

  Guida a come aggiungere un elemento al DOM usando Javascript.

  javascript guide

• 09 Apr 08
  

  gavino ang

  a node via the document tree, using children and parents, use document.childNo

  javascript dom

• 28 Oct 07
  

  hanslangouche

  javascript web

• 17 Sep 07
  

  Iko tikashi

  javascript DOM webdev

Would you like to comment?

Join Diigo for a free account, or sign in if you are already a member.