Java Script and HTML.

SLICING AND PLAYING

WITH HTML

Learning Java Script Editing

What is it?

Slicing HTML involves playing with the stuff on the

HTML Page like “divs”, “select boxes”, “input boxes”

and much-much more

Some key points

Every element is associated with the ID. ID is used to

access that object on the HTML page. And

document.getElementById(“element_name”) will give

you the power to access that element on the page.

Now you are just one step away from

altering/modifying the HTML page.

Key Points Cont…

document.getElementByTagsName(“div”) will give

you all the divs on the page. Again one step away

from editing the page. Isnt is simple?

Key Points Cont…

Inner HTML can be used to set the content of the

page. The good/bad thing about Inner html is that

it over writes what ever content is already

associated with that element.

Inner HTML replaces (over rides) already existing

conetnt.

Document Object Model

<html>

<head></head>

<body>

<p id=”story”>

Hey

<strong>Akshat</strong>

</p>

</body>

</html>

Main Properties to consider in the Dom

tree

nodeValue

nodeType

firstChild

lastChild

childNodes

What this refers to in the HTML

Document.getElementByTagsName(“body”)[0].child

Nodes[1].lastChild.

Answer :- strong.

Refer slide number 6 for HTML

Changing the node text

var node = document.getElementBId(“story”);

while(node.firstchild)

node.removechild(node.firstchild);

node.appendchild(document.createTextNode(“OK

Finally”));

Creating a new Element

var paragraph =document.createElement(p) – Just

specify the tag name here

paragraph.appendchild(document.createTextNode(“T

he text in the paragraph”));

document.getElementbyId(“story”).appendchild(parag

raph);

Java Script and HTML.

Automotive

Transcript of Java Script and HTML.