\

\

The ol and ul elements

The ol element defines an ordered list:

1. Coffee
2. Tea
3. Milk

\

The ul element defines an unordered list:

\

• Cookie
• Biscuit
• Toast

\

This is the story of the ol and ul elements.

\ Figure 1: HTML code in an HTML Document.

(11.) What does each of the following document object methods return, when the methods are applied to the HTML code in Figure 1: (A.) The document.getElementById("myHeader") method? [5 points] (B.) The document.getElementsByTagName("p") method? [5 points] (C.) The document.getElementsByClassName("myLi") method? [5 points] (D.) The document.querySelectorAll("body p") method? [5 points] (E.) The document.querySelector("body p") method? [5 points] (12.) How would you use one or more of the methods mentioned in question 11 to accomplish the following tasks (provide JavaScript code examples as part of your answers): (A.) Change which image is displayed using the element? [5 points] (B.) Determine which image is currently displayed using the element? [5 points] (C.) Change an element's CSS styling? [5 points] (13.) Table 2 contains two properties of an element object or the document object. Table 3 contains a few methods of an element object, a node object or the document object. Complete both tables, by answering the questions in the second and third columns of the tables. You may create more space in various cells of Tables 2 and 3 (say in a MS Word file), if you require more space while completing the tables. [63 points] (2 points for each row of the second columns in both tables and 5 points for each row of the third columns in both tables.) Table 2: Two Properties of an Element Object or the Document Object. Table 3: A Few Methods of an Element Object, a Node Object or the Document Object. (11.) What does each of the following document object methods return, when the methods are applied to the HTML code in Figure 1: (A.) The document.getElementById("myHeader") method? [5 points] (B.) The document.getElementsByTagName("p") method? [5 points] (C.) The document.getElementsByClassName("myLi") method? [5 points] (D.) The document.querySelectorAll("body p") method? [5 points] (E.) The document.querySelector("body p") method? [5 points] (12.) How would you use one or more of the methods mentioned in question 11 to accomplish the following tasks (provide JavaScript code examples as part of your answers): (A.) Change which image is displayed using the element? [5 points] (B.) Determine which image is currently displayed using the element? [5 points] (C.) Change an element's CSS styling? [5 points] (13.) Table 2 contains two properties of an element object or the document object. Table 3 contains a few methods of an element object, a node object or the document object. Complete both tables, by answering the questions in the second and third columns of the tables. You may create more space in various cells of Tables 2 and 3 (say in a MS Word file), if you require more space while completing the tables. [63 points] (2 points for each row of the second columns in both tables and 5 points for each row of the third columns in both tables.) Table 2: Two Properties of an Element Object or the Document Object. Table 3: A Few Methods of an Element Object, a Node Object or the Document Object