ECMAScript (formerly JavaScript) review:

• ECMAScript handout

An element:

• HTML/CSS:
  <div id='el' style='border:1px solid black; font-size; 12pt;'> ABC </div>

• Finding the element:

var e = document.getElementById("el");
e.innerHTML == "ABC";

• Creating it with pure ES:

var div = document.createElement("div");
div.id = "el";
div.style.border = "1px sold black";
div.style.fontSize = "12pt";
div.innerHTML = " ABC ";
X.appendChild(div);
// where <X> is the element in which we want to place the above div.

ECMAScript examples:

These examples demonstrate basic ES scripting examples

• An ECMAScript dynamic table 1 [ View source ]

  • Creates a table dynamically on page load using the document.write() method

• An ECMAScript dynamic table 2 [ View source ]

  • Creates a table dynamically after page load (by clicking a button) using the document.createElement() and element node appendChild() methods

• An ECMAScript color selector [ View source ]

  • Creates a color selector using sliders

• ECMAScript dynamic element positioning [ View source ]

  • Demonstrates moving elements around the screen using the mouse via absolute positioning

• A ECMAScript drag-and-drop example [ View source ]

  • Demonstrates a drag-and-drop interface using concepts learned in the previous examples.

• An ECMAScript canvas painting example [ View source ]

  • Demonstrates a simple line drawing program using the canvas element.