Slide 1

Slide 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vestibulum commodo ex id malesuada.

Slide 2

Slide 2

Suspendisse non odio sed nisi eleifend fringilla non at libero. Nam aliquet aliquet dolor, et pharetra lorem luctus ac.

Slide 3

Slide 3

Vestibulum fringilla velit ac justo eleifend, quis dictum velit fringilla. Nam ac magna eget odio tincidunt rhoncus.

titleOfModule

Video : 25-0 What matters in this milestone

Video : 25-1 What is dom, Connect your JS file with html file

Video : 25-2 Traversing dom - getElementsByTagName

My Awesome DOM de baba

  1. Jalali Set

  2. Shafayet

  3. bonobashi

  4. Dom de re baba

Video 25-3 Traversing dom - getElementByClass VS getElementById

Fruits I Like

Places I Like to visit

Video 25-4 Traversing dom - getElementByQuerySelector, querySelectorAll

Search google HTML collection vs nodeList

option 1: getElementsByTagName

option 2: getElementById

option 3: getElementsByClassName

option 4: querySelector

option 5: querySelectorAll

Video 25-5 : Dynamic style, getAttribute, setAttribute, innerText, innerHTML

Video 25-6 Styling dom properties, add and remove css class using JS

Video 25-7 NodeList, htmlcollection, parentNode, childnodes, createElement

Video 25-8 Create HTML elements using Javascript and appendChild

Video 24-9 Module summary (DOM Review)

QUIZ

Q1: What is DOM?
Ans: Document Object Model

Q2: Which of the following is true about JavaScript?
Ans: Both 1 & 3

Q3: How will you connect an external script in a html file?
Ans: script src =""/script

Q4: How will you get all the matching tags in a HTML file?
Ans: getElementsByTagName

Q5: What does the innerText give you?
Ans: Only the text inside the tag

Q6: Set font size to 30px.
document.getElementById(‘idName’)._____?________ = ‘30px’;
Ans: style.fontSize

Q7: How would you select the heading with id =”jantoos” using javascript? (be careful!)
Ans: document.getElementById("jantoos")

Q8: Every node in the DOM represents ______________? ( google it)
Ans: an HTML element

Q9: How many script tags can you add in a html file?
Ans: You can add as many as needed

Q9: The display value of most DOM elements is either inline or block. (google it).
Ans: true