Solve the problem that document.getElementBy series methods cannot obtain objects
|
getElementById cannot get the object There is a sequence when the browser parses the document. Before the page is loaded, or before the corresponding DOM object is loaded, the corresponding object cannot be obtained. Look at the following code:
<script>
var temp = document.getElementById("div");
alert(temp);
</script>
<body>
<div id="div">
<input name="username" id="username" type="text">
<button id="btn">Button</button>
</div>
</body> In this code, This is because when the browser parses the code in the script tag, the DOM elements in the body have not yet been loaded, so naturally nothing can be retrieved. Solution: Move the code in the script to after the body element.
<body>
<div id="div">
<input name="username" id="username" type="text">
<button id="btn">Button</button>
</div>
<script>
var temp = document.getElementById("div");
alert(temp);
</script>
</body>Or add window.onload
<script>
window.onload = function(){
var temp = document.getElementById("div");
alert(temp);
}
</script>Summarize The above is the editor's introduction to solving the problem that the document.getElementBy series methods cannot obtain objects. I hope it will be helpful to everyone. Thank you very much for your support of the 123WORDPRESS.COM website! |
>>: HTML solves the problem of invalid table width setting
Recommend
Steps to create a Vite project
Table of contents Preface What does yarn create d...
Public multi-type attachment image upload area in Vue page and applicable folding panel (sample code)
In front-end projects, attachment uploading is a ...
An article teaches you how to use Vue's watch listener
Table of contents Listener watch Format Set up th...
JavaScript to implement the function of changing avatar
This article shares the specific code of JavaScri...
A brief discussion on the underlying principle of mysql join
Table of contents join algorithm The difference b...
This article summarizes the specific use of CSS two-column layout and three-column layout
Preface With the development of big front-end, UI...
Example of using the href attribute and onclick event of a tag
The a tag is mainly used to implement page jump, ...
How many ports can a Linux server open at most?
Table of contents Port-related concepts: Relation...
How MySQL handles implicit default values
Some students said that they encountered the prob...
How to create an Nginx server with Docker
Operating environment: MAC Docker version: Docker...
Detailed explanation of how to install PHP7 on Linux
How to install PHP7 on Linux? 1. Install dependen...
Detailed explanation of screen command usage in Linux
GUN Screen: Official website: http://www.gnu.org/...
WeChat applet scroll-view realizes left-right linkage effect
WeChat applet uses scroll-view to achieve left-ri...
Detailed explanation of MySql 5.7.17 free installation configuration tutorial
1. Download the mysql-5.7.17-winx64.zip installat...
Tutorial on installing Microsoft TrueType fonts on Ubuntu-based distributions
If you open some Microsoft documents with LibreOf...