innerText innerHTML usage and precautions [Recommended]_javascript skills-JS Tutorial-php.cn

1: Dynamically change text and Html

[Ctrl A Select all Note: If you need to introduce external Js, you need to refresh to execute it

]

The innerText attribute is used to define the object The text to be output, in this example, innerText changes the text "How are you?" in the object DT into "I'm fine!" (statement DT.innerText="I'm fine!"). The innerHTML attribute is used to change the object DH. In addition to the function of innerText, it can also change the HTML statement inside the object DH, so it changes the text to "My last name is Xiao!" and the text output is changed to italics. () and add a straight line below (), that is, the statement DH.innerHTML="My last name is Xiao!". outerText and outerHTML also have similar functions, readers may wish to try them themselves.
2: Dynamic input and output of text

[Ctrl A Select all Note:

If you need to introduce external Js, you need to refresh to execute
]
The effect of this example is to first Enter text in the text box, and then press the "Output Text" button, and then the web page will automatically output the text you entered
Three: Note that innerHTML has an automatic syntax check function, which will automatically The HTML code is completely completed, which can be said to be magical

, for example, the following script

[Ctrl A Select all Note:
If you need to introduce external Js, you need to refresh to execute
]

The effect of running is like this of: innerText innerHTML usage and precautions [Recommended]_javascript skills

innerText innerHTML usage and precautions [Recommended]_javascript skills

As shown in the picture:

So please Be careful when using it. For example, an error will occur when doing such an operation. Copy the code

The code is as follows:

list.innerHTML=""; list.innerHTML="

"
An intermediate variable must be used
Html code

Copy code The code is as follows:

var html="";
html ="

";
list.innerHTML=html;
var html="html ="

";
list.innerHTML=html;

This way the problem can be solved.
Also:
innerText in It is not supported under Firefox. Some people do this on the Internet
innerHTML is an attribute that complies with W3C standards, and innerText is only applicable to IE browsers. Therefore, use innerHTML as much as possible and less innerText. If To output content without HTML tags, you can use innerHTML to obtain the content containing HTML tags, and then use regular expressions to remove the HTML tags. Here is a simple example that complies with W3C standards:
No HTML, compliant with W3C standards

Related labels：

Precautions

source：php.cn

Previous article：Javascript cast type conversion function_javascript skills Next article：javascript 贪吃蛇(详细注释版)_javascript技巧

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