gpt4 book ai didi

javascript - 如何用 Javascript 替换整个 HTML 内容?

转载 作者:行者123 更新时间:2023-11-27 23:14:24 27 4
gpt4 key购买 nike

我尝试使用 $("html").html(this.responseText);。它替换了内容,但不替换 head 和 body 标签。

例如,如果我想替换此内容:

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script>...</script>
<script>...</script>
</head>
<body>

<h1>This is a Heading</h1>


<script>...</script>
</body>
</html>

然后我在检查器中检查我的 HTML 结构,结果是这样的:

<!DOCTYPE html>
<html>
<title>Page Title</title>
<script>...</script>
<script>...</script>

<h1>This is a Heading</h1>

<script>...</script>

</html>

它把我的 CSS 搞得一团糟。我试过没有脚本,效果很好。这个问题的解决方案是什么?

我也尝试过使用 javascript 方法

document.open();
document.write(this.responseText);
document.close();

但它混淆了我的 javascripts。我收到重新声明语法错误。

我要实现的真实代码:

<script>

var frm = $('#frm');
var submitActors = frm.find('input[type=submit]');
var submitActor = null;
submitActors.click(function(event) {
submitActor = this;
});

frm.unbind('submit').submit(function () {

var formAction = document.getElementById("frm").getAttribute('action'); // Get the form action.
var data = "";
var pageUrl = "";
var test_uuid = "";
var test_number = "";
var qid = JSON.parse(sessionStorage.getItem('userChoice')).qid;



if(submitActor.name == "cmdSave"){
data = {
"cmdSave" : $("#cmdSave").val(),
"Answer": document.querySelector('input[name="Answer"]:checked').value,
"csrfmiddlewaretoken": document.querySelector('input[name=csrfmiddlewaretoken').value,
"qid": qid
}
}
else if(submitActor.name == "cmdNext"){
data = {

"cmdNext": document.querySelector('#cmdNext').value,
"csrfmiddlewaretoken":document.querySelector('input[name=csrfmiddlewaretoken').value,
"qid": qid
}
}
var httpRequest = new XMLHttpRequest();
var formData = new FormData();



Object.keys(data).forEach(function(key) {
console.log(key, data[key]);
formData.append(key, data[key]);
});
console.log(formData)
httpRequest.onreadystatechange = function(){
if ( this.readyState == 4 && this.status == 200 ) {
var response = this.responseText;
console.log(this.responseText) // Display the result inside result element.

// 1.Option
{% comment %} document.open();
document.write(this.responseText);
document.close(); {% endcomment %}

// 2.Option

{% comment %} document.documentElement.innerHTML = this.responseText; {% endcomment %}


// 3.Option
$(document).ready(function(){
$("html").html(response);
});


test_number = document.getElementById("lblNrCrt").textContent;
test_uuid = "{{test.uuid}}";
pageUrl = "/intro/" + test_uuid + "/" + test_number + "/";
window.history.pushState('', '', pageUrl);
}
};

httpRequest.open("post", formAction);
httpRequest.send(formData);

return false;

});

</script>

最佳答案

正如我所指出的那样

document.querySelector('html').innerText = 'yolo';

但是如果你需要渲染 HTML 你应该这样做

document.querySelector('html').innerHTML = '<div>yolo</div>';

关于javascript - 如何用 Javascript 替换整个 HTML 内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58335774/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com