Commit de35f01

committed

DOM-Documents

1 parent c567483 commit de35f01Copy full SHA for de35f01

File tree

+42

-0

lines changed

JavaScript/Advance/DOM/2.DOM Documents
- images
  - js-logo.png
- index.html
- script.js

+42

-0

lines changed

4.15 KB

Lines changed: 18 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,18 @@`
	`1`	`+<!DOCTYPE html>`
	`2`	`+<html lang="en">`
	`3`	`+`
	`4`	`+<head>`
	`5`	`+ <meta charset="UTF-8">`
	`6`	`+ <meta http-equiv="X-UA-Compatible" content="IE=edge">`
	`7`	`+ <meta name="viewport" content="width=device-width, initial-scale=1.0">`
	`8`	`+ <title>DOM Documents</title>`
	`9`	`+</head>`
	`10`	`+`
	`11`	`+<body>`
	`12`	`+ <h1>DOM Documents</h1>`
	`13`	`+ <button onclick="DisplayOne()">View Doc</button>`
	`14`	`+ <p id="textOne"></p>`
	`15`	`+ <script src="script.js"></script>`
	`16`	`+</body>`
	`17`	`+`
	`18`	`+</html>`

Lines changed: 24 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,24 @@`
	`1`	`+let textOne = document.getElementById('textOne');`
	`2`	`+`
	`3`	`+function DisplayOne() {`
	`4`	+ textOne.innerHTML = `
	`5`	`+ <h2>Finding HTML Elements</h2>`
	`6`	`+ <li>1. document.getElementById('id')</li>`
	`7`	`+ <li>2. document.getElementByTagName(name)</li>`
	`8`	`+ <li>3. document.getElementByClassName('name')</li>`
	`9`	`+ <h2>Changing HTML Elements</h2>`
	`10`	`+ <li>1. element.innerHTML = new html content</li>`
	`11`	`+ <li>2. element.attribute = new value</li>`
	`12`	`+ <li>3. element.style.property = new style</li>`
	`13`	`+ <h3>Method</h3>`
	`14`	`+ <li>4. element.setAttribute(attribute, value)</li>`
	`15`	`+ <h2>Adding and Deleting HTML Elements</h2>`
	`16`	`+ <li>1. document.createElement(element)</li>`
	`17`	`+ <li>2. document.removeChild(element)</li>`
	`18`	`+ <li>3. document.appendChild(element)</li>`
	`19`	`+ <li>4. document.replaceChild(new, old)</li>`
	`20`	`+ <li>5. document.write(text)</li>`
	`21`	`+ <h1>Adding Events Handlers</h1>`
	`22`	`+ <li>document.getElementById(id).onclick = function(){code}</li>`
	`23`	+ `
	`24`	`+}`

Comments

(0)