我想通过AJAX发送一段html内容(不是表单数据)。 我知道如何在 jQuery 中做到这一点,但我想用 javascript 实现。
HTML(我想发送具有 id=stack 的内容)
单击“发送”按钮后,必须将响应加载到 id=target
<div id='stack'>
<ol>
<li>stack 1</li>
<li>stack 2</li>
<li>stack 3</li>
</ol>
</div>
<button id='btn'>SEND</button>
<article id='target'></article>
AJAX
var btn = document.getElementById('btn');
var target = document.getElementById('target');
// Function for AJAX
function stack(){
var main = document.getElementById('stack');
var xhr = new XMLHttpRequest();
xhr.open("POST", "process.php", true);
xhr.onreadystatechange = function(){
if(xhr.readyState ==4 && xhr.status == 200){
target.innerHTML = xhr.responseText;
}
}
xhr.send(main);
}
// Bind with the onclick event
btn.addEventListener('click',stack,false);
process.php
<?php
$div = $_POST;
print_r($div);
?>
After running my above code it is just displaying Array() because Ajax method is not sending the div.
请帮助我使用 Javascript 而不是 jQuery
最佳答案
不要发送元素引用本身,获取 outerHTML
属性并发送该属性,如下所示:xhr.send(main.outerHTML);
这会发送元素的字符串版本,包括其后代。
引用:https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML
关于javascript - 如何使用 AJAX 发送 div 元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58130163/