Fatal编程技术网
  • javascript/
  • Javascript 简单的AJAX帮助请求：“的重要性”+=&引用；应用于字符串

Javascript 简单的AJAX帮助请求：“的重要性”+=&引用；应用于字符串

javascript ajax

Javascript 简单的AJAX帮助请求：“的重要性”+=&引用；应用于字符串,javascript,ajax,operators,string-concatenation,Javascript,Ajax,Operators,String Concatenation,我刚刚开始学习AJAX，有一个非常新的问题。 我正在读Packt Publishing，Darie等人的书《AJAX和PHP：构建响应性Web应用程序》 第2章第50页显示了使用XMLHttpRequest进行非常简单的异步调用的代码 代码如下。我的问题是，“+=”javascript操作符在这段代码中做了什么，例如在示例中： myDiv.innerHTML += "Request status: 1 (loading) <br/> myDiv.innerHTML+=“请求状态：

我刚刚开始学习AJAX，有一个非常新的问题。 我正在读Packt Publishing，Darie等人的书《AJAX和PHP：构建响应性Web应用程序》

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

代码如下。我的问题是，“+=”javascript操作符在这段代码中做了什么，例如在示例中：

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

myDiv.innerHTML+=“请求状态：1（正在加载）
此页面显示它用于将字符串添加到一起：

但是，如果把上面的例子加在一起会是什么样子呢？从一个新手的角度来看，这没有什么意义。 我不明白如果连在一起会是什么

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

myDiv.innerHTML+=“请求状态：1（正在加载）
因此，我希望有人能帮助这个新手了解正在发生的事情

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

使用XMLHttpRequest进行异步调用的操作时间

1-在Foundation文件夹中，创建名为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>


AJAX基础：使用XMLHttpRequest
你好，服务器！
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);
      }
    }
  }

//保存XMLHttpRequest的一个实例
var xmlHttp=createXmlHttpRequestObject（）；
//创建XMLHttpRequest实例
函数createXmlHttpRequestObject（）
{
//将存储对XMLHttpRequest对象的引用
var-xmlHttp；
//这应该适用于除IE6和更早版本之外的所有浏览器
尝试
{
//尝试创建XMLHttpRequest对象
xmlHttp=新的XMLHttpRequest（）；
}
捕获（e）
{
//假设IE6或更高版本
var XmlHttpVersions=新数组（“MSXML2.XMLHTTP.6.0”，
“MSXML2.XMLHTTP.5.0”，
“MSXML2.XMLHTTP.4.0”，
“MSXML2.XMLHTTP.3.0”，
“MSXML2.XMLHTTP”，
“Microsoft.XMLHTTP”）；
//尝试每个程序id，直到其中一个工作
对于（var i=0；i”；
}
else if（xmlHttp.readyState==2）
{
myDiv.innerHTML+=“请求状态：2（已加载）
”；
}
else if（xmlHttp.readyState==3）
{
myDiv.innerHTML+=“请求状态：3（交互式）
”；
}
//当readyState为4时，我们还读取服务器响应
else if（xmlHttp.readyState==4）
{
//仅当HTTP状态为“OK”时继续
if（xmlHttp.status==200）
{
尝试
{
//从服务器读取消息
response=xmlHttp.responseText；
//显示消息
myDiv.innerHTML+=“请求状态：4（完成）。服务器说：
”；
myDiv.innerHTML+=响应；
}
捕获（e）
{
//显示错误消息
警报（“读取响应时出错：+e.toString（））；
}
}
其他的
{
//显示状态信息
警报（“检索数据时出现问题：\n”+
xmlHttp.statusText）；
}
}
}

myDiv.innerHTML+=“请求状态：1（正在加载）
”；
实际上等于：

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

myDiv.innerHTML=myDiv.innerHTML+“请求状态：1（正在加载）
”；
所以
+=
的意思是：取左边变量的值，将右边的值添加（或者当你谈论字符串时，连接）到它，然后将它加载回左边的变量

哦，不要再使用W3School了，它们和我们无关，它们不是官方的，而且是一个糟糕的资源。如果您想要Javascript（或CSS、HTML、DOM等）引用，请尝试

例如，他们解释了像
+=
这样的速记赋值运算符的作用，可能对您有很大帮助。

它将文本添加到名为myDiv的元素中。类似于在
和
标记之间写入文本

使用+=是因为他希望附加文本而不是替换文本。在编写代码时，它会在不同的请求状态发生时写入它们。

我假设javascript代码中的
myDiv
对象表示html代码中的

如果
…
中有html内容，
+=
操作员会告诉javascript附加到该内容，而不是替换它 
myDiv.innerHTML = myDiv.innerHTML + "Request status: 1 (loading) <br/>";

var cost = 2;
cost += ' dollars'; // cost is now a string: "2 dollars”