Single Choice Question

  1. Which of the following is used to get one element by id in JavaScript?
    1. document.getElementById()
    2. document.getElementsByName()
    3. document.getElementsByTagName()
    4. document.getElementsByClassName()
  2. Which of the following is used to get one element only?
    1. document.getElementById()
    2. document.getElementsByName() 返回NodeList
    3. document.getElementsByTagName() 返回HTMLCollection
    4. document.getElementsByClassName() 返回HTMLCollection
  3. To change the HTML content of an element, which of the following is used?
    1. innerHTML 获取或设置元素的 HTML 内容
    2. innerText获取或设置元素的可见文字
    3. textContent 获取或设置元素的文本内容
    4. nodeValue 只能用于文本节点
  4. In the DOM, which object is used to represent the root node of the DOM tree?
    1. document 表示整个网页的 HTML 文档，是 DOM 树的根节点
    2. window 表示整个浏览器窗口，包含 document、location、console 等
    3. navigator 提供浏览器的信息（如浏览器类型、版本）
    4. screen 提供用户屏幕的信息（如分辨率）
  5. Which following object has the biggest scope in JavaScript?
    1. document window 是全局对象（Global Object），具有最大作用域，其他对象都是它的属性
    2. window window.document
    3. navigator
    4. screen
  6. To get the next neighboring element, which of the following is used?
    1. nextNode
    2. nextElementSibling
    3. nextSibling
    4. nextElement
  7. Which of the following is used to get all elements with the same class name?
    1. document.getElementById()
    2. document.getElementsByName() 获取具有相同 name 属性的元素
    3. document.getElementsByTagName()
    4. document.getElementsByClassName()
  8. How many children do the div in above code have? 
                    
                    <div>
                        <p>
                            This is a paragraph of text with a
                            <a href="page.html">link</a>.
                        </p>
                    </div>
    1. 1 关注的是div的直接子节点，只有p
    2. 2
    3. 3
    4. 4

True or False Question

  1. The DOM is a programming interface for HTML and XML documents.
    2. True
  2. The DOM is a programming language.
    3. False
  3. In JavaScript, the document object represents the HTML document.
    4. True
  4. Only one element can be selected by its id.
    5. True

Definition of Term

  1. DOM Tree
    DOM Tree 是网页的结构化表示(structured representation)，以树状层级形式展现 HTML 元素。每个标签是一个节点，允许 JavaScript 动态访问和操作网页内容。
  2. BOM
    BOM 是JavaScript与浏览器窗口交互的接口，包含 window、navigator、screen、location 等对象，用于控制浏览器行为而不是网页内容。

Short Answer

  1. What is the DOM tree of a web page?
    DOM 树是HTML网页结构的树状表示，网页中的每个标签、文本、属性都是树中的一个节点，JavaScript可以通过DOM树操作网页内容。
    The DOM (Document Object Model) tree is a hierarchical, tree-like representation of the structure of an HTML or XML document. Each HTML element, attribute, and piece of text is a node in the tree. JavaScript uses the DOM tree to access, modify, add, or delete content on a web page.
  2. How many ways to access an element in JavaScript?
    6种方式
    1. document.getElementById("id") – by ID (returns one element)
    2. document.getElementsByClassName("class") – by class name (returns a collection)
    3. document.getElementsByTagName("tag") – by tag name (returns a collection)
    4. document.getElementsByName("name") – by name attribute (used in forms)
    5. document.querySelector("selector") – by CSS selector (returns the first match)
    6. document.querySelectorAll("selector") – by CSS selector (returns all matches)