Coding a dynamic script

Since JavaScript gives you access to all of the elements of a document, you can access and modify their style attribute (typically set by CSS) using the style DOM node property.
The scripts you create can be alter as a result of user interactions or events.

Let’s say we want to change the background color of the div_1 and the border of the div_2 when user’s mouse moves over the div with the id div_1.

<div id="div_1">
Cotent of the first div.
<div id="div_2">
Cotent of the second div.
var d1 = document.getElementById("div_1");
var d2 = document.getElementById("div_2");
d1.onmouseover = function () { = "#00FF00"; = "5px";
d1.onmouseout = function () { = "#FFFFFF"; = "1px";

Of course this is just an example but you can modify the entirety of the HTML code within a given element using the DOM node innerHTML property.

Leave a Reply