1

ajax 呼び出しからすべての要素を取得し、それらを別の要素に挿入したい:

  • jquery の使用 (純粋な JavaScript を使用したいだけです)
  • ajax レスポンスを含む新しい要素を作成する

これが私が試したことです：

index.php

<!DOCTYPE HTML>    
    <head>
        <script type="text/javascript">

            function loadPage() {
                var ajax = new XMLHttpRequest();
                ajax.open('GET', 'test.php', true);
                ajax.onreadystatechange = function (){
                    if(ajax.readyState === 4 && ajax.status === 200){
                        document.getElementById('output').appendChild( ajax.responseText ) ; 
                    }  
                };
                ajax.send();
                }

                loadPage();
        </script>
    </head>
    <body>
        <div id="output">
            <h1>Default</h1>
        </div>
    </body>
    </html>

test.php

<h1>
     its work
</h1>

<div>
    <h2>
        its work2
    </h2>
</div>

私はすでにそれをグーグルで調べましたが、答えは常にjQueryを使用することでした.

4

3 に答える 3

1

Node.appendChildNode引数としてオブジェクトが必要です。test.php から得られるのは文字列です。innerHTML代わりに使用してみてください

document.getElementById('output').innerHTML = ajax.responseText;

XHR レベル 2 の時点で、およびプロパティをチェックする代わりに、単純にonloadハンドラーをアタッチできます。XHRreadyStatestatus

ajax.onload = function() {
    document.getElementById('output').innerHTML += this.responseText;
}
于 2013-10-23T06:44:03.820 に答える
0

これを見ましたか

http://w3schools.com/ajax/ajax_examples.asp

http://w3schools.com/ajax/tryit.asp?filename=tryajax_first

あなたが見つけた例のほとんどはjqueryを使用していると思います.jqueryはクロスブラウザになるからです

于 2013-10-23T06:46:39.280 に答える
0

これを試してください

   function loadPage(){ 
var strURL="test.php";

var req = getXMLHTTP();

if (req) {

req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) { 
document.getElementById('output').value=req.responseText; 
    } else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
} 
} 
req.open("POST", strURL, true);
req.send(null);
} 

}



 function getXMLHTTP() { //function to return the xml http object
    var xmlhttp = false;
    try {
        xmlhttp = new XMLHttpRequest();
    } catch (e) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e1) {
                xmlhttp = false;
            }
        }
    }
于 2013-10-23T06:51:18.483 に答える