正常的执行带码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>function的执行顺序问题解决方案</title>
<script src="jquery-3.3.1.min.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
#demo1, #demo2, #demo3, #demo4 {
float: left;
width: 100%;
height: 30px;
background-color: #00A5BB;
margin: 1px auto;
color: #fff;
}
</style>
</head>
<body>
<div id="demo1"></div>
<div id="demo2"></div>
<div id="demo3"></div>
<div id="demo4"></div>
<script>
$(function () {
getDemo1();
getDemo2();
getDemo3();
getDemo4();
function getDemo1() {
$('#demo1').html('demo1');
}
function getDemo2() {
$('#demo2').html('demo2');
}
function getDemo3() {
$('#demo3').html('demo3');
}
function getDemo4() {
$('#demo4').html('demo4');
}
})
</script>
</body>
</html>
一、当其中的一个函数被注释掉或则删除的时候，调用对应的getDemo2();也必须注释掉或则删除，否则将影响后面的getDemo3()和getDemo4()的正常执行
/* function getDemo2() {
$('#demo2').html('demo2');
}*/
二、HTML中对应的div可以任意删除或注释，不受影响；
<div id="demo1"></div>
<div id="demo2"></div>
<div id="demo3"></div>
<div id="demo4"></div>
三、调用的函数，也可以任意删除或注释，不受影响；
getDemo1();
getDemo2();
getDemo3();
getDemo4();
