Skip to content

Latest commit

 

History

History
51 lines (33 loc) · 2.07 KB

unit-5-lesson-04.md

File metadata and controls

51 lines (33 loc) · 2.07 KB

Lesson 5.4: Revisiting DOM Manipulation


Lesson Materials

📖 Upload as Material in Google Classroom:

📝 Upload as Assignment in Google Classroom (5 points):


Key Points

👋 Welcome (5) :

  • Welcome students to class and get settled.
  • ❌ Do Now: A lot of content for this lesson.

☑️ .createElement (6) :

  • The next three section cover the exploration of creating, manipulating, and appending elements in the DOM.
  • Instructions on how to use this method to create a new element in the document.
  • Include examples of creating different types of elements (e.g., div, p, img) and emphasize the importance of specifying the correct tag name.

🖼️ DOM Manipulation (7) :

  • Explanation on how to use different properties to get or set the HTML contained within an element.
  • Explanation on how to use different properties to style an element.
  • Provide examples showing how to dynamically update the content of an element, such as adding text or HTML to a div.

✚ .appendChild (7) :

  • Guidance on how to insert a created element into the DOM by appending it as a child of a specified parent element.
  • Include step-by-step instructions and examples, such as creating a new list item and adding it to an existing unordered list.

💻 Code Solo (15) :

  • Guide students through coding exercises, applying what they've learned in a practical context.
  • Offer support and encourage experimentation.

👋 Exit Ticket & Closing (5)

  • Direct students to the Exit Ticket in Google Classroom, ensuring all questions are answered.
  • Summarize key takeaways, remind students to submit the exit ticket, and provide any closing remarks.

Common Misconceptions

Additional Materials

  • n/a