PHP代理jQuery部分到javascript

下面是在jQuery中完成的代码，目的是将其更改为javascript。原始代码来自此处：

以下是要更改为javascript的jQuery：

$(function(){

  // Handle form submit.
  $('#params').submit(function(){
    var proxy = 'ba-simple-proxy.php',
      url = proxy + '?' + $('#params').serialize();

      // Make GET request.
      $.get( url, function(data){

        $('#response')
          .html( '<pre class="brush:xml"/>' )
          .find( 'pre' ) // To make the lines proper and to frame the text.
            .text( data );

      });

    // Prevent default form submit action.
    return false;
  });
});

---

有什么建议可以让这项工作顺利进行吗？jQuery部分是一个工作示例，但javascript部分还不是。

好的，这里是一篇没有jQuery的Ajax文章（要查看它的实际操作，请注意，这使用了JSFIDLE，它要求方法是POST，这略有不同）：

没有jQuery帖子
document.getElementById（'Button'）。onclick=function（）{
var-xmlhttp；
if（window.XMLHttpRequest）{
xmlhttp=新的XMLHttpRequest（）；
}
否则{
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
xmlhttp.onreadystatechange=函数（）{
if（xmlhttp.readyState==4&&xmlhttp.status==200）{
document.getElementById（“response”）.innerHTML=“response returned！
数据：“+xmlhttp.responseText；
}
}
var params=“html=”+escape（document.getElementById（“url”）.value）+“&delay=3”；
open（“POST”，“/echo/html/”，true）；
setRequestHeader（“内容类型”，“应用程序/x-www-form-urlencoded”）；
setRequestHeader（“内容长度”，参数长度）；
setRequestHeader（“连接”，“关闭”）；
xmlhttp.send（params）；
}

---

这就是为什么像jQuery这样的东西很好，它们对开发人员隐藏了所有这些：）

为什么要替换jQuery？看起来，如果您的原始代码正常工作，那么它将处理浏览器、事件处理和DOM操作中的细微差异，以使用基本方法使代码更清晰。

function loadajax() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp=new XMLHttpRequest();
        }
    else {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("response").innerHTML=xmlhttp.responseText;
        }
    }

    var urlvar=(document.getElementById("url").value)

    xmlhttp.open("GET","ba-simple-proxy.php&url="+urlvar,true);
    xmlhttp.send();
}

function ajaxcontent() {
    var xelement=document.createElement("pre");
    xelement.className="brush:xml";
    var xtext=document.createTextNode( loadajax() );
    xelement.appendChild(xtext);
}

<input id="url" value="http://google.com/"/>
<button id="Button">No jQuery POST</button>
<div id="response" style="border: dashed 1px black;"></div>

document.getElementById('Button').onclick = function() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    }
    else {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("response").innerHTML = "Responce returned!<br/>Data:" + xmlhttp.responseText;
        }
    }

    var params = "html=" + escape(document.getElementById("url").value) + "&delay=3";
    xmlhttp.open("POST", "/echo/html/", true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader("Content-length", params.length);
    xmlhttp.setRequestHeader("Connection", "close");

    xmlhttp.send(params);
}