jsLoading execution sequence in html
1. Loading sequence: introduce the order of appearance of the tag <script></script>,
# on the page ##JavascriptThe code is part of the HTML document, so the order in which Javascript is executed when the page is loaded is the order in which the introduction tags <script></script> appear,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题 3</title>
<script>
alert("1-最先执行");
</script>
</head>
<body onload="alert('3-最后执行');">
<script>
alert("2-接着执行");
</script>
</body>
</html>2. The global variables and functions defined by each script can be called by scripts executed later.
The call to a variable must have been declared previously, otherwise the variable value obtained will be undefined.<script type="text/javscrpt">//<![CDATA[ alert(tmp); //输出 undefined var tmp = 1; alert(tmp); //输出 1//]]> </script>
3. In the same script, the function definition can appear after the function call. However, if it is in two pieces of code and the function call is in the first piece of code, a function undefined error will be reported.
<script type="text/javscrpt">//<![CDATA[
aa(); //浏览器报错//]]>
</script>
<script type="text/javscrpt">//<![CDATA[
aa(); //输出 1
function aa()
{
alert(1);
}//]]>
</script>4.document
.write() will write the output to the location of the script document. After the browser parses the content of the document where documemt.write() is located, continue Parse the content output by document.write(), and then continue to parse the HTML document.
<script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript" src="test.js"><//script>');
document.write('<script type="text/javascript">');
document.write('alert(2);')
document.write('alert("我是" + tmpStr);');
document.write('<//script>'); //]]>
</script>
<script type="text/javascript">//<![CDATA[
alert(3); //]]>
</script>test.js的内容是： var tmpStr = 1; alert(tmpStr);
The order of the pop-up values in Firefox and Opera is: 1, 2, I am 1, 3
The order of the pop-up values in IE is: 2, 1, 3, at the same time The browser reported an error: tmpStr is undefined
The reason may be that when IE is document.write, it does not wait for the Javascript code in SRC to be loaded before executing the next line, so 2 pops up first,
and executes to the document .write('document.write("I am" + tmpStr)') When calling tmpStr, tmpStr is not defined and an error is reported.
To solve this problem, you can use HTML parsing to parse an
HTML tag
and then execute the next one by splitting the code: document.write('
In this way, the order of output values under IE and other browsers is consistent. : 1, 2, I am 1, 3
: Under IE, when using the Document.Write method to reference the js file, the js file will appear to have not been loaded. In the case of direct call, it is recommended to place the referenced JS file in a separate script block. To ensure that the referenced js file is fully loaded, continue to execute the subsequent Document.Write content5. JS function execution sequence with the same name
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript">
function aa() {
alert('First aa')
}
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<br />
<input id="Button1" type="button" value="button" onclick="aa();"/>
</form>
</body>
<script type="text/javascript">
function aa(s) {
alert('Second aa');
}
function aa(s) {
alert('Last aa');
}
</script>
</html>Click "botton" to execute the result: Last aa
After a function with the same name appears in js, after you call the js function in the web page, the last loaded function in the page will always be called.
The above is the detailed content of Detailed explanation of js loading and execution order in html. For more information, please follow other related articles on the PHP Chinese website!
es6数组怎么去掉重复并且重新排序May 05, 2022 pm 07:08 PM去掉重复并排序的方法：1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句，去掉数组中的重复元素，返回去重后的新数组；2、利用sort()对去重数组进行排序，语法“去重数组.sort()”。
JavaScript的Symbol类型、隐藏属性及全局注册表详解Jun 02, 2022 am 11:50 AM本篇文章给大家带来了关于JavaScript的相关知识，其中主要介绍了关于Symbol类型、隐藏属性及全局注册表的相关问题，包括了Symbol类型的描述、Symbol不会隐式转字符串等问题，下面一起来看一下，希望对大家有帮助。
原来利用纯CSS也能实现文字轮播与图片轮播！Jun 10, 2022 pm 01:00 PM怎么制作文字轮播与图片轮播？大家第一想到的是不是利用js，其实利用纯CSS也能实现文字轮播与图片轮播，下面来看看实现方法，希望对大家有所帮助！
JavaScript对象的构造函数和new操作符（实例详解）May 10, 2022 pm 06:16 PM本篇文章给大家带来了关于JavaScript的相关知识，其中主要介绍了关于对象的构造函数和new操作符，构造函数是所有对象的成员方法中，最早被调用的那个，下面一起来看一下吧，希望对大家有帮助。
JavaScript面向对象详细解析之属性描述符May 27, 2022 pm 05:29 PM本篇文章给大家带来了关于JavaScript的相关知识，其中主要介绍了关于面向对象的相关问题，包括了属性描述符、数据描述符、存取描述符等等内容，下面一起来看一下，希望对大家有帮助。
javascript怎么移除元素点击事件Apr 11, 2022 pm 04:51 PM方法：1、利用“点击元素对象.unbind("click");”方法，该方法可以移除被选元素的事件处理程序；2、利用“点击元素对象.off("click");”方法，该方法可以移除通过on()方法添加的事件处理程序。
foreach是es6里的吗May 05, 2022 pm 05:59 PMforeach不是es6的方法。foreach是es3中一个遍历数组的方法，可以调用数组的每个元素，并将元素传给回调函数进行处理，语法“array.forEach(function(当前元素,索引,数组){...})”；该方法不处理空数组。
整理总结JavaScript常见的BOM操作Jun 01, 2022 am 11:43 AM本篇文章给大家带来了关于JavaScript的相关知识，其中主要介绍了关于BOM操作的相关问题，包括了window对象的常见事件、JavaScript执行机制等等相关内容，下面一起来看一下，希望对大家有帮助。
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
AI Hentai Generator
Generate AI Hentai for free.
Hot Article
Hot Tools
SublimeText3 Chinese version
Chinese version, very easy to use
MinGW - Minimalist GNU for Windows
This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.
Zend Studio 13.0.1
Powerful PHP integrated development environment
SublimeText3 Mac version
God-level code editing software (SublimeText3)
WebStorm Mac version
Useful JavaScript development tools
