Home » » Creating Elements, Attributes, and Objects

Creating Elements, Attributes, and Objects

02:03
An important benefit of dynamic content is the ability to create new content from
freshly received data. This is necessary in dynamic menu creation, navigation, breadcrumbs,


and web services, among other applications. Ajax relies on content changing
within the page without having to reload the entire page. To accomplish this, we
need to create new parts of the DOM.
The first method we will concentrate on is createElement( ), which is used to create a
new Element node. An example of this method is:

var element = document.createElement('div');
alert(element.nodeName); /* Alerts 'DIV' */

createElement( ) takes as a parameter the name of the element type to instantiate,
and creates an element of that specified type. It returns an instance of an Element
interface. This is useful as it allows attributes to be directly specified on the returned
element node. In this case, we created a new <div> element and used the variable
element to store that interface.
Categories: 
Related Posts:
  • JavaScript Alert The JavaScript alert is a dialogue box that pops up and takes the focus away from the current window and forces the web browser to read the message. 1. <form> <input type="button" onclick= "alert('Are you sure you… Read More
  • Javascript Array You can access the contents of a simple variable just by using the variable’s name.For example, alert(lastName) opens an alert box with the value stored in the variablelastName. However, because an array can hold more than o… Read More
  • JavaScript String Split Function split()The split() method splits (for lack of a better word) a string up into substrings and returns them in an array. It accepts a string or regular expression argument containing the delimiter at which the string will be b… Read More
  • Creating A Function In Javascript The basic structure of a function looks like this: function functionName() {// the JavaScript you want to run} The keyword function lets the JavaScript interpreter know you’re creating a function—it’s similar to how you use … Read More
  • Javascript String Constructor String is the built-in object corresponding to the primitive string data type. It contains a very large number of methods for string manipulation and examination, substring extraction, and even conversion of strings to marke… Read More
  • JavaScript System Dialogs alert(),confirm(),prompt() The browser is capable of invoking system dialogs to display to the user through the alert(),confirm(), and prompt() methods. These dialogs are not related to the web page being displayedin the browser and do not contain HTM… Read More
  • Javascript Do While Loops There’s another, less common type of loop, known as a do/while loop. This type ofloop works nearly identically to a while loop. Its basic structure looks like this: do {// javascript to repeat} while (condition) ; do {var l… Read More
  • JavaScript Popups <head><script type="text/javascript">function testPopup() {window.open( "http://www.google.com/" )}</script></head><body><form><input type="button" onClick="testPopup()" value="Click"&g… Read More
  • HTML5 Constraint Validation API HTML5 introduces the ability for browsers to validate data in forms before submitting to theserver. This capability enables basic validation even when JavaScript is unavailable or fails to load.The browser itself handles per… Read More
  • Javascript For Loops JavaScript offers another type of loop, called a for loop, that’s a little more compact(and a little more confusing). For loops are usually used for repeating a series ofsteps a certain number of times, so they often involve… Read More
  • Javascript Object Type Objects are created by using the new operator followed by the name of the object type to create. Developerscreate their own objects by creating instances of the Object type and adding properties and/ormethods to it, as show… Read More
  • Javascript Making a simple MouseOver <a href="http://www.cit.cornell.edu"onMouseOver="document.logo.src='family.gif ' ; "onMouseOut ="document.logo.src='harry.gif ' ; " ><img name="logo" src="harry.gif " border=0></a> The onMouseOver and onM… Read More
  • JavaScript Redirect <script type="text/javascript"> window.location = "http://www.yoursite.com/" </script> … Read More
  • Javascript While Loops A while loop repeats a chunk of code as long as a particular condition is true; in otherwords, while the condition is true. The basic structure of a while loop is this: while (condition) {// javascript to repeat} The first l… Read More
  • JavaScript Variables Variables store a value you can refer to later in the script. Variable namescan be nearly any valid identifi er. A JavaScript identifi er is a word thatcontains only letters, numbers, $, and _, and that doesn’t start with an… Read More