Presentation is loading. Please wait.

Presentation is loading. Please wait.

getElementById() document.getElementById(“idName").innerHTML = “Any valid content"; getElementById is a method innerHTML is a property.

Similar presentations


Presentation on theme: "getElementById() document.getElementById(“idName").innerHTML = “Any valid content"; getElementById is a method innerHTML is a property."— Presentation transcript:

1

2 getElementById() document.getElementById(“idName").innerHTML = “Any valid content"; getElementById is a method innerHTML is a property.

3 getElementsByClassName() var elements= document.getElementsByClassName(“className"); for(var i=0;i { "@context": "http://schema.org", "@type": "ImageObject", "contentUrl": "http://images.slideplayer.com/12/3343485/slides/slide_3.jpg", "name": "getElementsByClassName() var elements= document.getElementsByClassName( className ); for(var i=0;i

4 getElementsByTagName var z=document.getElementsByTagName("div"); for(var i=0;i { "@context": "http://schema.org", "@type": "ImageObject", "contentUrl": "http://images.slideplayer.com/12/3343485/slides/slide_4.jpg", "name": "getElementsByTagName var z=document.getElementsByTagName( div ); for(var i=0;i

5 How to change Style element.style.property=

6 How to change Style var z=document.getElementsByTagName("div"); for(var i=0;i { "@context": "http://schema.org", "@type": "ImageObject", "contentUrl": "http://images.slideplayer.com/12/3343485/slides/slide_6.jpg", "name": "How to change Style var z=document.getElementsByTagName( div ); for(var i=0;i

7 Change the attribute of an HTML element element.attribute= element.setAttribute(attribute,value)

8 Image src Attribute Change function changeI() { var x=document.getElementById("img1"); x.src=“src2"; }

9 DOM Nodes

10 Creating New HTML Elements This is a paragraph. This is another paragraph. var para = document.createElement("p"); var node = document.createTextNode("This is new."); para.appendChild(node); var element = document.getElementById("div1"); element.appendChild(para);

11 Creating new HTML Elements - insertBefore() This is a paragraph. This is another paragraph. var para = document.createElement("p"); var node = document.createTextNode("This is new."); para.appendChild(node); var element = document.getElementById("div1"); var child = document.getElementById("p1"); element.insertBefore(para,child);

12 Removing Existing HTML Elements This is a paragraph. This is another paragraph. var parent = document.getElementById("div1"); var child = document.getElementById("p1"); parent.removeChild(child);

13 Replacing HTML Elements This is a paragraph. This is another paragraph. var para = document.createElement("p"); var node = document.createTextNode("This is new."); para.appendChild(node); var parent = document.getElementById("div1"); var child = document.getElementById("p1"); parent.replaceChild(para,child);


Download ppt "getElementById() document.getElementById(“idName").innerHTML = “Any valid content"; getElementById is a method innerHTML is a property."

Similar presentations


Ads by Google