Document properties and methods of JS

In JavaScript, the document object is a very important global object, which represents the entire HTML document. You can access and modify the content and structure of an HTML document through the document object. The following are some common document properties and methods:

Properties

1.document.title: Get or set The title of the document, usually displayed in the browser's title bar or tab.

javascript

document.title = "新的页面标题";

2. document.URL: Get the complete URL of the document.

javascript

console.log(document.URL);

3. document.documentElement: Get the root element of the document, usually the element.

javascript

console.log(document.documentElement);

4. document.body: Get the element of the document.

javascript

console.log(document.body);

5. document.head: Get the element of the document.

javascript

console.log(document.head);

6. document.referrer: Get the URL of the previous page that navigates to the current page.

javascript

console.log(document.referrer);

Method

1.document.getElementById (id): Get the element based on the specified id.

javascript

var element = document.getElementById("myElementId");

2. document.getElementsByClassName(className): Get the element collection based on the specified class name.

javascript

var elements = document.getElementsByClassName("myClassName");

3. document.getElementsByTagName(tagName): Get the element collection based on the specified tag name.

javascript

var elements = document.getElementsByTagName("div");

4. document.querySelector(selector): Returns the first Element in the document that matches the specified CSS selector.

javascript

var element = document.querySelector(".myClass");

5. document.querySelectorAll(selector): Returns a NodeList of all Element elements in the document that match the specified CSS selector ( still).

javascript

var elements = document.querySelectorAll(".myClass");

6. document.createElement(tagName): Create a new element.

javascript

var newElement = document.createElement("div");

7. document.createTextNode(text): Create a new text node.

javascript

var textNode = document.createTextNode("Hello, world!");

8. document.appendChild(node): Append a child node to an element of the document.

javascript

someElement.appendChild(newElement);

9. document.removeChild(node): Remove a child node from the document.

javascript

someElement.removeChild(childElement);

9. document.write(content): Write HTML expression or JavaScript code to the document.

javascript

document.write("<p>这是一个段落。</p>");

This is just some of the properties and methods of the document object. In fact, the document object provides many other functions and methods for handling the content and structure of HTML documents. You can learn more by consulting the relevant JavaScript documentation or tutorials.

The above is the detailed content of Document properties and methods of JS. For more information, please follow other related articles on the PHP Chinese website!