可以使用localstorage保存和检索数据
为了保存数据

localStorage.setItem(linkValue, textValue);

并接收数据

localStorage.getItem(linkValue);

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

使用localStorage属性的工作示例。

保存数据

关键是创建一个临时存储链接的变量。在这个例子中，我将变量命名为savedLinks。
因为我们将链接表示为自定义的textValue。最好将链接的数据存储为Object数据类型，因为它允许我们使用textValue作为唯一的键标识符，这可以用来防止DOM上重复的链接名称。
变量savedLinks更新后，保存到localStorage。
例如：localStorage.setItem("links")。
我决定将savedLinks变量作为links存储在我的localStorage中，但您可以将其命名为最适合您的名称。我还决定使用自定义函数saveLink()更新和保存savedLinks数据，因为它允许我以后在重复时排除进一步的链接包含。

function saveLink(textValue, linkValue) {
  
  if (textValue in savedLinks)
  {
    // return false, with a popup message (alert)
    alert(`Link with textValue '${textValue}' already exists.`);
    return false;
  }

  // Include the link into the 'savedLinks' variable,
  // Then, save 'savedLinks' variable to the localStorage.
  savedLinks[textValue] = linkValue;
  localStorage.setItem("links", JSON.stringify(savedLinks));

  return true;
}

注意：

• LocalStorage仅将键值对存储为字符串。
• LocalStorage数据可以使用DevTools手动删除（部分：存储），并通过清除浏览器的缓存。
• 此外，localStorage数据唯一地保存到特定浏览器。因此，保存在Chrome中的内容无法被Firefox访问。

导入保存的数据

一旦设置了localStorage变量，我们就可以使用命令localStorage.getItem("links")访问它。
我们可以在任何时候尝试检索localStorage数据，因为如果代码失败，它将返回null值。我们可以使用它将变量savedLinks声明为一个空Object，如下所示：
var savedLinks = JSON.parse(localStorage.getItem("links")) || {};
parse（）将把保存在localStorage数据中的构造为JavaScript值或对象。如果没有它，我们将不得不处理字符串数据类型。
因为我们总是将savedLinks初始化为Object。我们可以简单地遍历可用的键并将链接导入DOM。

Object.keys(savedLinks).forEach(key => {
  let textValue = key;
  let linkValue = savedLinks[key];
  createLink(textValue, linkValue);
});

新增

我决定在createLink()函数中保护链接。这是因为当我试图访问导入到DOM的链接时，我被重定向到本地目录而不是指定的地址。但是，我这样做最重要的是因为包含TLS（传输层安全性）和SSL（ ssl 层）提高了客户端的安全性。

工作示例

超文本标记语言

<form action="#" id="createElForm">
  <label for="" style="display: block;">Write or paste a link</label>
  <input type="text" placeholder="www.example.com" id="linkInput" required>
  <label for="" style="display: block;">Text to display</label>
  <input type="text" placeholder="Example Text" id="textInput" required>
  <br>
  <br>
  <button type="submit" style="display: block;">Submit</button>
</form>
  
<table></table>

JS -函数

function createLink(textValue, linkValue) {
  // If TLS or SSL is NOT included in the link
  // Then, secure the link's connection with TLS protocol 
  if (!linkValue.includes('https://')) {
    if (!linkValue.includes('http://')) {
      linkValue = 'https://' + linkValue;
    }
  }

  // Construct the link and append it to the <table>

  let newRow  = document.createElement("tr");
  let newCell = document.createElement("td");
  let newLink = document.createElement("a");

  newLink.href = linkValue;
  newLink.target = "_blank";
  newLink.style.color = "blue";
  newLink.textContent = textValue;

  newCell.appendChild(newLink);
  newRow.appendChild(newCell);
  table.appendChild(newRow);
}

function saveLink(textValue, linkValue) {
  
  if (textValue in savedLinks)
  {
    // return false, with a popup message (alert)
    alert(`Link with textValue '${textValue}' already exists.`);
    return false;
  }

  // Include the link into the 'savedLinks' variable,
  // Then, save 'savedLinks' variable to the localStorage.
  savedLinks[textValue] = linkValue;
  localStorage.setItem("links", JSON.stringify(savedLinks));

  return true;
}

JS -主脚本

const form  = document.querySelector("#createElForm");
const table = document.querySelector("table");
// Get saved 'links' Object from the localStorage.
// Otherwise, set variable 'savedLinks' to an empty Object.
const savedLinks = JSON.parse(localStorage.getItem("links")) || {};

// Create any saved links to the DOM
Object.keys(savedLinks).forEach(key => {
  let textValue = key;
  let linkValue = savedLinks[key];
  createLink(textValue, linkValue);
});

form.addEventListener("submit", function(e) {
  e.preventDefault();

  let linkValue = document.querySelector("#linkInput").value;
  let textValue = document.querySelector("#textInput").value;

  // Try to save the link into the localStorage.
  // If the link is already saved, stop this script. 
  if (!saveLink(textValue, linkValue)) return;
  
  createLink(textValue, linkValue);
  form.reset();
});

（请原谅我的英语和拼写）
创建一个javascript对象，并在其中输入信息，然后将对象保存到本地存储，然后在页面重新加载时获取对象并创建链接

// create a function that saves the link info
function saveLinkInfo(href,target,color,textContent){
  
  // put the parametors in an object to make a link object
  const link = {href,target,color,textContent};

  // if you have links in your localstorage get them with the "localStorage.getItem("linkInfo")" method
  // use "JSON.parse()" to convert them into an object 
  //if you dont have any create an object, the below line does all that
  var linkInfo = JSON.parse(localStorage.getItem("linkInfo")) || {};

  // create a unique id for the new link
  // below i do this by geting an array of all the keys of values in the links info variable with the "Object.keys(linkInfo)" method
  // then i get the legth of the array and add 1, this will create a unique id like in sql auto encrement ids
  var linkId = Object.keys(linkInfo).length + 1;
  
  // add the link object to the linkInfo Object using the id we created as the key
  linkInfo[linkId] = link;

  // turn the linkinfo onject to a jason string
  // we are doing this becase you can only save strings to the loacal storage
  linkInfo = JSON.stringify(linkInfo);

  // save the linkinfo stringified object to your localstorage
  localStorage.setItem("linkInfo",linkInfo);
}

此函数创建链接并返回具有链接的表行（tr元素）

// create the links on page reload
function createLinks(){
  // get the linkInfo object and use "JSON.parse()" to turn it back into an object
  //  remember we turned it into a Json string before saving it in the "saveLinkInfo()" function
  const linkInfo = JSON.parse(localStorage.getItem("linkInfo")) || {};
  const newRow = document.createElement("tr");
  const newCell = document.createElement("td");

  // loop through the object and create the link
  for(let key in linkInfo){
    if(linkInfo.hasOwnProperty(key)){
      
      const newLink  = document.createElement("a");
      newLink.href = linkInfo[key].href;
      newLink.target = linkInfo[key].target;
      newLink.style.color = linkInfo[key].color;
      newLink.textContent = linkInfo[key].textContent;

      newCell.appendChild(newLink);
      newRow.appendChild(newCell);
    }
  }
  
  // return the row
  return newRow;
}

如果有什么我需要澄清或如果我误解了你想做什么请评论，