由于我不熟悉编程并尝试一次学习多种语言,因此我在一个文件夹中制作了一系列文件,以测试这些不同的语言/技术如何协同工作。在该文件夹中,我有两个php文件(包括我正在测试的主文件;'index.php'),一个css文件,一个json文件和两个javascript文件。问题是,当我使用XAMPP apache服务器在浏览器中运行它时,引用“ index.php”文件上的“ script.js”和“ secondscript.js”文件的脚本似乎执行错误。根据情况订购。我希望它们都按照它们在文件中出现的顺序执行,但是如果我使用Chrome,即使我交换它们在文件中的写入顺序以及使用Firefox,也始终会首先执行“ secondscript.js” ,始终先执行“ script.js”。这是代码:
index.php:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css"> <!-- ADD CSS -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- ADD JQUERY -->
<script> window.jQuery || document.write('<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"><\/script>')</script> <!-- ADD JQUERY BACKUP -->
<script src="secondscript.js"></script>
<!-- ADD JQUERY TEST -->
<script src="script.js"></script>
<!-- ADD JAVASCRIPT -->
</head>
<body>
<div id="ajaxdiv"></div>
<!-- ADD AJAX TEST -->
<?php include 'server.php'?>
<!-- ADD PHP -->
<noscript>Sorry, your browser does not support JavaScript!</noscript>
<!-- ADD BACKUP FOR JSLESS BROWSER -->
</body>
</html>
script.js:
document.write("<h1>Header</h1>")
Request = new XMLHttpRequest()
Request.open('GET', 'json.json')
Request.onload = function (){
Data = JSON.parse(Request.responseText)
p = document.createElement('p')
node = document.createTextNode(Data[1].Three)
p.appendChild(node)
document.getElementById("ajaxdiv").appendChild(p)
}
Request.send()
secondscript.js:
$(function() { alert('Alert') })
server.php:
<?php echo 'PHP TEST'?>
style.css:
body {background-color: pink}
h1 {color: red}
p {color: purple}
json.json:
[{"One": "A", "Two": "B"}, {"Three": "C", "Four": "D"}]
编辑:“首先执行”对我来说似乎是这样,因为通过ajax出现的“ C”出现在警报消息之前或之后,具体取决于浏览器。