Shulou(Shulou.com)06/01 Report--

In this article, the editor introduces in detail "what are the selectors of javascript", the content is detailed, the steps are clear, and the details are handled properly. I hope this article "what are the selectors of javascript" can help you solve your doubts? let's follow the editor's ideas slowly to learn new knowledge.

Javascript has a selector. Commonly used js selectors are: getElementById (), getElementsByName (), getElementsByTagName (), querySelector (), querySelectorAll () and so on.

The operating environment of this tutorial: windows7 system, javascript1.8.5 version, Dell G3 computer.

Javascript has a selector.

JavaScript is most commonly used to get or modify the content or value of a HTML element and to apply certain effects.

To do this, you must first find the element. And the javascript selector is used to match the element, the search method:

Find HTML elements through ID

Find HTML elements by tag name

Find HTML elements by class name

Find the HTML element through the CSS selector

Find HTML elements through a collection of HTML objects

Commonly used js selectors are: getElementById (), getElementsByName (), getElementsByTagName (), getElementsByClassName (), querySelector (), querySelectorAll ().

Press ID to find HTML elements

You can use the getElementById () method to select an element based on its unique ID.

This is the easiest way to find the HTML element in the DOM tree.

The following example selects an element with the ID attribute id= "msg":

Var x = document.getElementById ("msg")

If the element is found, the method returns the element as an object.

If the element cannot be found, the myElement will contain null.

Find HTML elements by tag name

You can also use the getElementsByTagName () method to select the HTML element by tag name.

This method returns a list of similar arrays of all elements in a document with the specified tag name.

Example: select all

Elements:

Var x = document.getElementsByTagName ("p")

Find HTML elements by class name

You can use the getElementsByClassName () method to select all elements with a specific class name.

This method returns a list of similar arrays of all elements in a document with the specified class name.

This example returns a list of all elements with class= "demo":

Var x = document.getElementsByClassName ("demo")

Find the HTML element through the CSS selector

You can use the querySelectorAll () method to select elements (ID, class, type, etc.) that match the specified CSS selector.

This method returns a list of similar arrays of all elements that match the specified selector.

The CSS selector provides a very powerful and efficient way to select HTML elements in a document.

Var x = document.querySelectorAll ("div")

Find HTML elements through a collection of HTML objects

The topmost element in an HTML document can be used directly as a document attribute.

For example, you can use attributes to access the element document.documentElement.

The element can be accessed with the document.body attribute.

Var html = document.documentElement;var body = document.body

Note: if document.body is used before the tag (for example, inside), it will return the null instead of the body element.

You can also access the following HTML objects (and object collections):

Attribute description document.anchors returns all elements with name attributes document.applets returns all elements (deprecated in HTML5) document.baseURI returns the absolute basic URIdocument.body of the document [xss_clean] returns the document's cookiedocument.doctype returns the document's document type document.documentElement returns the element document.documentMode returns the pattern used by the browser document.documentURI returns the document's URIdocument.domain returns the document server's domain name document.domConfig has been deprecated Return DOM configure document.embeds return all elements document.forms return all elements document.head return elements document.images return all

Element document.implementation returns DOM implementation document.inputEncoding returns the encoding of the document (character set) document.lastModified returns the date and time of the document update document.links returns all href attributes and the element document.readyState returns the document's (loading) status document.referrer returns the referrer's URI (linked document) document.scripts returns all elements document.strictErrorChecking returns whether error checking document.title returns element document. URL returns the complete URL of the document. Read here. This article "what are the selectors of javascript" has been introduced, and if you want to master the knowledge of this article, you still need to practice and use it. If you want to know more about the article, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.