我刚刚开始学习AJAX，有一个非常新的问题。我正在阅读Packt出版社，Darie等人的《AJAX和PHP：构建响应式Web应用程序》一书
Ch。2，第50页显示了使用XMLHttpRequest进行非常简单的异步调用的代码。
代码如下。我的问题是，"+="javascript运算符在这段代码中做了什么，比如在示例中：
myDiv.innerHTML += "Request status: 1 (loading) <br/>
此W3schools页面显示它用于将字符串添加到一起：http://www.w3schools.com/js/js_operators.asp
但是，如果把上面的例子加在一起，会是什么样子？从新手的角度来看，这并没有什么意义。我不明白如果把它连在一起会是什么。
myDiv.innerHTML += "Request status: 1 (loading) <br/>
因此，我希望有人能帮助这个新手了解正在发生的事情。
以下是书中所有的代码及其解释，逐字逐句。请参阅代码的最后一部分，以解决我对字符串使用"+="javascript运算符的问题
行动时间——使用XMLHttpRequest 进行异步调用
1-在foundations文件夹中，创建一个名为async的子文件夹。
2-在async文件夹中，创建一个名为async.txt的文件，并在其中添加以下文本
你好，客户！
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。
例如，他们有一个很好的表格来解释像+=这样的速记赋值运算符的作用，这可能对您有很大帮助。
它正在将文本添加到名为myDiv的元素中。就像在<div>和</div>标签之间写入文本一样。
使用+=是因为他想附加文本而不是替换文本。在你的代码中，它会在不同的请求状态发生时写入。
我假设javascript代码中的myDiv对象表示html代码中的<div id="myDivElement" />。
如果<div id="myDivElement">....</div>中有html内容，+=操作符会告诉javascript附加到该内容，而不是替换它
我在阅读中发现了一段有趣的文章，它有助于解决原帖子的问题：
"现代JavaScript：开发和设计"(c)拉里·厄尔曼。2012.
"JavaScript定义的第二部分说，JavaScript是一种弱类型语言，这意味着变量和数据可以很容易地从一种类型转换为另一种类型。例如，在JavaScript中，你可以创建一个数字，然后将其转换为字符串：
var cost = 2;
cost += ' dollars'; // cost is now a string: "2 dollars”
"在强类型语言中，创建一个新变量(如成本)也需要指示其严格类型。以下是ActionScript中变量声明和赋值的方法，ActionScript在其他方面与JavaScript非常相似：var成本：int=2；//成本必须是一个整数！
此外，在强类型语言中，试图将数字转换为字符串(如JavaScript代码)会产生错误。一些程序员欣赏弱类型语言所提供的灵活性；其他程序员认为弱类型允许草率的编码。公平地说，由于隐式类型转换，可能会出现错误。(JavaScript也被称为动态类型，因为转换可以自动发生，就像上面的代码一样。)但是，如果你在编程时意识到类型转换，那么潜在的错误就会得到缓解，你可以充分利用语言的灵活性。">