XMLHttpRequest 替换元素不适用于 LocalStorage

Posted 2023-03-05

【中文标题】XMLHttpRequest 替换元素不适用于 LocalStorage

【英文标题】：XMLHttpRequest Replace Element Won't Work With LocalStorage

【发布时间】：2020-01-16 06:49:02

【问题描述】：

我尝试在 javascript 代码中使用 localStorage 实现 cookie 日志记录，以替换特定元素。它使用 XMLHttprequest 方法，我不知道为什么它不能与 localStorage 一起使用。请赐教。

localStorage.setItem("replace1", this.JSON.parse(responseText));

function loadDoc() 
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() 
    if (this.readyState == 4 && this.status == 200) 
       document.getElementById("replace1").innerhtml = localStorage.getItem("replace1"); 
    
  ;
  xhttp.open("GET", "yoinkexecutor2.php", true);
  xhttp.send();

【问题讨论】：

repsonseText 是一个我相信的对象，因此使用 JSON.parse(responseText); 然后从该对象中检索属性

由于某种原因它仍然输出“未定义”

在哪一行代码中未定义？

我用更改的代码更新了帖子，元素只输出“未定义”，根本不显示元素。 i.imgur.com/Wn4JNCI.png现场natevanghacks.com/scriptexecutors2.php

我认为问题在于你应该把document.getElementById("replace1").innerHTML = localStorage.getItem("replace1");放在localStorage.setItem("replace1", this.JSON.parse(responseText)); 之后，因为异步行为，你试图在数据来自XHR请求之前显示一些东西

【参考方案1】：

您只能在异步操作 (GET) 请求终止时显示数据。

否则你会得到 undefined，因为在该键下的 localStorage 中没有任何内容存在

此外，您只能将字符串存储在本地存储中，这意味着一旦您想使用 getItem 检索数据，就需要解析该对象字符串

 function loadDoc() 
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() 
    if (this.readyState == 4 && this.status == 200) 
      localStorage.setItem("replace1", JSON.stringify(this.responseText))
      document.getElementById("replace1").innerHTML = JSON.parse(localStorage.getItem("replace1"))
    
  ;
  xhttp.open("GET", "yoinkexecutor2.php", true);
  xhttp.send();

【讨论】：

但是 JSON.stringify 似乎也不起作用，因为它在控制台中输出错误。未捕获的 ReferenceError：未在 XMLHttpRequest.xhttp.onreadystatechange 中定义 responseText。 i.imgur.com/rEafTqI.png

再查一下，应该是this.responseText

那太好了，哈哈。但是由于某种原因，当我刷新页面时，元素返回到其默认状态。只有当我单击它时，元素才会更改为 url 之一。奇数

@NateVang 这很奇怪 localStorage 应该保持状态。

是的，这很奇怪，我的意思是你搞定了一切。在这里，您可以看到natevanghacks.com/scriptexecutors2.php 当您单击 Yoink Executor 元素时，它会更改为 url 之一，但随后您刷新页面，它会恢复到默认状态。哈哈 man 代码有时会让人头疼。