JS access selected DOM node (with code)

php中世界最好的语言
Release: 2018-04-20 10:23:57
Original
1815 people have browsed it

This time I will bring you JS access to the selected DOM node (with code). What are theprecautionsfor JS access to the selected DOM node? The following is a practical case, let's take a look.

The example of this article describes the method of JS to access theDOM objectspecified node. Share it with everyone for your reference, the details are as follows:

1 Introduction

Use thegetElementById()method to access the specified id node, and use thenodeNameattribute,nodeTypeattribute andnodeValueattribute to display the node name, node type and node value.

1,nodeNameAttribute

This attribute is used to obtain the name of a node.

[sName=]obj.nodeName

sName:StringThe variable is used to store the name of the node.

2,nodeTypeAttribute

This attribute is used to obtain the type of a node.

[sType=]obj.nodeType

sType: String variable, used to store the type of node, the value of this type is numeric . The type of this parameter is shown in the table below.

Type Value Node name Description
Element ) 1 tag Any HTML or XML tag
Attribute 2 Attribute Attribute in tag
Text (text) 3 #text Contains the text in the tag
Comment 8 #comment HTML comment
Document 9 #document Document Object
Document Type (documentType) 10 DOCTYPE DTD Specification

3.nodeValueProperty

This property will return the value of the node.

[txt=]obj.nodeValue

txt: String variable is used to store the value of the node, except for text node types. The node values of the type are all "null".

Second application

Access the specified node. In this example, the name of the specified node and the type of the node are displayed in the prompt box that pops up on the page. and the value of the node.

Three codes

    
  

三号标题

加粗内容
Copy after login

Fourth run will pop up the following prompt box:

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

What are the uses of swiper in vue

mint-ui implements three-level linkage case sharing

The above is the detailed content of JS access selected DOM node (with code). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!