在另一个HTML页面中更改div

Question

还在这里学习一些javascript，做了其他事情，但现在是它的最后也是最重要的部分。

我有两个html页面-其中一个使用javascript动态添加文本字段（当然也要删除它们）（genmain.html），另一页面使用文本字段输入（table.html）。

所以我已经创建了一个函数来检索值数组。

function getElementArray(divName){
   var names = document.getElementsByName("namefield");
}

变量名是一个数组，它具有字段中的所有值。

问题是我想将数组中的这些值设置为页面上另一个div的值。 经过一番搜索，我知道可以用'id'-s来完成，但我不确定，也不完全知道如何做。

假设我在另一页（table.html）上有很多div，但是其中一些具有id =“ MAIN”。 我想在div内更改值

例如

<div id="MAIN">THIS PART I WANT TO CHANGE</div>

Javascript不是我学校系统的一部分，我已经完成了CodeAcademy教程，这是我所获得的最多的知识，我希望你们能为我的问题提供帮助。

Answer 1

变量名是一个数组，它具有字段中的所有值。

function getElementArray(divName){
   var names = document.getElementsByName("namefield");
}

不，您仅在此处引用了元素。 您还没有价值。

您可以通过遍历名称Nodelist数组并使用names[i].value来获取值。

问题是我想将数组中的这些值设置为页面上另一个div的值

如果要在同一页面中，则使用DOM的innerHTML或textContent属性分配值。

document.getElementById("MAIN").textContent= names[1].value;

出于演示目的，我在此处使用names[1] ，这样它将加载第二个输入值。

假设我在另一页（table.html）上有很多div，但是其中一些具有id =“ MAIN”。 我想在div内更改值

一旦您移至另一个页面，则javascript状态将丢失。 因此，您将无法访问该页面内的names 。

您必须将这些值存储到localStorage中并在下一页中进行检索。

否则，将值添加到您的URL的query字符串中，然后在其中进行检索。

编辑：根据评论更新

让我们假设您有var names = document.getElementsByName("namefield"); 以便将值存储在localStorage中。

var myValues = [],
    names = document.getElementsByName("namefield");
    for(var i = 0; i < names.length; i++) {
        myValues.push(names[i].value);
    } 
    localStorage.myValues = JSON.stringify(myValues);

现在，如果您的下一页是Iinside window.onload事件：

   window.onload = function() {
       var myValues = localStorage.getItem("myValues") ? JSON.parse(localStorage.getItem("myValues")) : [],
           divElements = document.querySelectorAll("#MAIN");
       for(var i =0; i < myValues.length; i++) {
           divElements[i].textContent = myValues[i];
       }
   }

Answer 2

如果要设置或更改元素的内容，则可以使用innerHTML属性。

因此，在您的情况下， document.getElementById("MAIN").innerHTML = "Whatever you want";

作为记录，您的示例中的names从技术上讲不是数组，而是NodeList 。 参见https://developer.mozilla.org/en/docs/Web/API/NodeList#Why_is_NodeList_not_an_Array.3F 。