【WEB基础】④关于AJAX

就现在接触所见，我把AJAX分为两种：

1.纯JS

  <script language="javascript" type="text/javascript" charset="utf-8">
  var xmlHttp;
  <!--创建传输对象-->
  function createXMLHttpRequest()
  {
     if(window.ActiveXObject)
     {
        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
     }
     else if(window.XMLHttpRequest)
     {
        xmlHttp=new XMLHttpRequest();
     }
  }
  <!--调动函数，向后台传值-->
  function select_change()
  {
     var deptNames=document.getElementById("deptNames").value;
     if(deptNames!=null){
          createXMLHttpRequest();
          var url="action.DeptChangeJListServlet?deptNames="+deptNames;
          xmlHttp.open("POST",url,true);
          xmlHttp.onreadystatechange=showMember;
          xmlHttp.send(null);
          }
  }
  <!--接收后台数据-->
  function showMember()
  {
     if(xmlHttp.readyState==4)
     {
        if(xmlHttp.status==200)
        {
           <!--以纯文本格式接收后台数据-->
           var membersData=xmlHttp.responseText;
           <!--以标签为标识接收后台数据-->
           var membersData=xmlHttp.responseXML.getElementsByTagName("jobNames");
           var membeRSSelect=document.getElementById("jobNames");
           membeRSSelect.options.length=0;
           
           for(var i=1;i<membersData.length;i++)
           {
             
             var mvalue=membersData[i].childNodes[1].firstChild.nodeValue;
             var option=new Option(mvalue,mvalue);
             try
             {
                membeRSSelect.appendChild(option);
             }
             catch(e)
             {
                alert(e);
             }
           }
        }
        else
        {
           alert("您请求的页面有异常！");
        }
     }
     else
     {
     }
  }
  </script>

2.Jquery

<script type="text/javascript" src="resources/scripts/jquery-1.2.6-vsdoc-cn.js"></script>
    <script type="text/javascript">
        function textLoginName() {
                $.ajax({
                    type: "post",url:"action.NameCheckServlet",data: "loginName=" + $('#loginName').val(),success: function(data,textStatus) {
                        $("#loginNames").html("");
                        $("#loginNames").append(data);
                    },error: function() {
                        alert('出错了！');
                    }
                });
            }
    </script>

后台

response.setContentType("text/html,charset=utf-8");
response.setHeader("Charset","utf-8");
response.setCharacterEncoding("utf-8");//设置输出编码格式
PrintWriter out=response.getWriter();

sb.append("<jobNames>");
Map map=new DeptChangeService().DeptChange();
List list =(List) map.get(deptNames);
System.out.println();
for (Object object : list) {
<span style="white-space:pre">	</span>sb.append("<jobNames><id>"+1+"</id><name>"+object.toString()+"</name></jobNames>");
<span style="white-space:pre">	</span>}
<span style="white-space:pre">	</span>sb.append("</jobNames>");
<span style="white-space:pre">	</span>out.write(sb.toString());
<span style="white-space:pre">	</span>out.flush();
<span style="white-space:pre">	</span>out.close();