gpt4 book ai didi

javascript - 简单的 AJAX 帮助请求 : significance of "+=" applied to string

转载 作者:行者123 更新时间:2023-11-29 16:13:23 25 4
gpt4 key购买 nike

我刚刚开始学习 AJAX 并且有一个非常新的问题。我正在阅读 Packt Publishing、Darie 等人撰写的“AJAX 和 PHP:构建响应式 Web 应用程序”一书。

章。 2,第 50 页显示了使用 XMLHttpRequest 进行非常简单的异步调用的代码。

代码如下。我的问题是,“+=”javascript 运算符在这段代码中做了什么,例如在示例中:

myDiv.innerHTML += "Request status: 1 (loading) <br/> 

这个 W3schools 页面显示它用于将字符串加在一起: http://www.w3schools.com/js/js_operators.asp

但是,如果把上面的例子加在一起会是什么样子呢?从一个新手的 Angular 来看,这并没有什么意义。如果将它们串联在一起,我不明白这会是什么。

myDiv.innerHTML += "Request status: 1 (loading) <br/> 

因此,我希望有人能帮助这个新手了解正在发生的事情。

这是书中逐字逐句的所有代码及其解释。请参阅代码的最后一部分,以解决我关于在字符串上使用“+=”javascript 运算符的问题。:

实践时刻——使用 XMLHttpRequest 进行异步调用

1- 在 foundations 文件夹中,创建一个名为 async 的子文件夹。

2- 在 async 文件夹中,创建一个名为 async.txt 的文件,并向其中添加以下文本

Hello client!

3- 在同一文件夹中创建一个名为 async.html 的文件,并向其中添加以下代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>AJAX Foundations: Using XMLHttpRequest</title>
<script type="text/javascript" src="async.js"></script>
</head>
<body onload="process()">
Hello, server!
<br/>
<div id="myDivElement" />
</body>
</html>

4- 使用以下内容创建名为 async.js 的文件

 // holds an instance of XMLHttpRequest
var xmlHttp = createXmlHttpRequestObject();
// creates an XMLHttpRequest instance
function createXmlHttpRequestObject()
{
// will store the reference to the XMLHttpRequest object
var xmlHttp;
// this should work for all browsers except IE6 and older
try
{
// try to create XMLHttpRequest object
xmlHttp = new XMLHttpRequest();
}
catch (e)
{
// assume IE6 or older
var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
"MSXML2.XMLHTTP.5.0",
"MSXML2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP",
"Microsoft.XMLHTTP");
// try every prog id until one works
for (var i = 0; i < XmlHttpVersions.length && !xmlHttp; i++)
{
try
{
// try to create XMLHttpRequest object
xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
}
catch (e) {
}
}
}
// return the created object or display an error message
if (!xmlHttp)
alert("Error creating the XMLHttpRequest object.");
else
return xmlHttp;
}
// called to read a file from the server
function process()
{
// only continue if xmlHttp isn't void
if (xmlHttp)
{
// try to connect to the server
try
{
// initiate reading the async.txt file from the server
xmlHttp.open("GET", "async.txt", true);
xmlHttp.onreadystatechange = handleRequestStateChange;
xmlHttp.send(null);
}
// display the error in case of failure
catch (e)
{
alert("Can't connect to server:\n" + e.toString());
}
}
}
// function that handles the HTTP response
function handleRequestStateChange()
{
// obtain a reference to the <div> element on the page
myDiv = document.getElementById("myDivElement");
// display the status of the request
if (xmlHttp.readyState == 1)
{
myDiv.innerHTML += "Request status: 1 (loading) <br/>";
}
else if (xmlHttp.readyState == 2)
{
myDiv.innerHTML += "Request status: 2 (loaded) <br/>";
}
else if (xmlHttp.readyState == 3)
{
myDiv.innerHTML += "Request status: 3 (interactive) <br/>";
}
// when readyState is 4, we also read the server response
else if (xmlHttp.readyState == 4)
{
// continue only if HTTP status is "OK"
if (xmlHttp.status == 200)
{
try
{
// read the message from the server
response = xmlHttp.responseText;
// display the message
myDiv.innerHTML += "Request status: 4 (complete). Server said: <br/>";
myDiv.innerHTML += response;
}
catch (e)
{
// display error message
alert("Error reading the response: " + e.toString());
}
}
else
{
// display status message
alert("There was a problem retrieving the data:\n" +
xmlHttp.statusText);
}
}
}

最佳答案

myDiv.innerHTML += "Request status: 1 (loading) <br/>";

实际上等于:

myDiv.innerHTML = myDiv.innerHTML + "Request status: 1 (loading) <br/>";

所以+=的意思是:取左边变量的值,加上(或者当你说字符串的时候,连接)右边的值,然后加载回来到左边的变量。


哦,停止使用 w3chools,它们与 W3C 无关,它们不是官方的,而且无论如何都是不好的资源。如果您需要 Javascript(或 CSS、HTML、DOM 等)引用,请尝试 MDN .

例如,他们有a quite nice table关于解释像 += 这样的速记赋值运算符的作用,可能对您有很大帮助。

关于javascript - 简单的 AJAX 帮助请求 : significance of "+=" applied to string,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21715287/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com