JavaScript简单搜索-如何在新页面上显示结果？

在作业中，我们应该使用搜索按钮上的事件侦听器构建一个简单的搜索功能。因此有一个名为store.js的文件，其中包含一个全局对象数组，用于模拟相册数据库。当用户搜索艺术家时，应在新页面上显示结果。我让它在数组中循环，得到结果，并在页面上显示。 我搞不懂的是如何打开“搜索结果”页面，并在那里显示结果。如果我将结果保存到一个全局变量，并尝试在新页面上显示它，它会显示“undefined”。 请注意，这是一个初学者客户端JS类，因此不需要任何“后端”语言。 如果有任何提示或批评，我将不胜感激

这来自作业说明：

创建一个名为search.js的文件

在search.js脚本中创建一个事件监听器，该监听器由一个名为search的函数处理，该函数处理 “提交”按钮用于搜索

当我在搜索框中键入艺术家姓名（我现在只按艺术家姓名搜索）并点击提交时，您的搜索 函数应该循环遍历中的假相册数据库 store.js文件。打开一个新页面并在上的列表中显示结果 那一页。您将需要对该部分使用dom操作

谢谢大家!

HTML:

//搜索
var result=“未找到任何内容！”；
函数displaySearch（）{
var displayResult=document.getElementById（“displayResult”）；
window.history.pushState（{}，“Test”，“search.html”）；//伪重定向
document.body.innerHTML=result；//清除所有内容（通过重写）+添加结果
}
函数doSearch（）{
var searchField=document.getElementById（“searchField”）.value；
result=db.filter（el=>el.artist.toUpperCase（）==searchField.toUpperCase（））.map（el=>el.artist.join（“
”）；
//过滤，然后获取艺术家的名字，并从该数组中创建一个html字符串
displaySearch（）；
}
函数搜索（）{
document.getElementById（“searchButton”）.addEventListener（“单击”，doSearch，false）；
}
window.addEventListener（“加载”，搜索，false）；

---

与你提出的问题不同，我提供了一个完整的解决方案。但你说得很对，我觉得没关系。我还添加了一些你在学校里不知道的ES6内容，所以这个答案对于作弊是没有用的。如果应用程序完全没有服务器，那么有两个页面是没有意义的。这就是我实施url更改的原因，当您调用

窗口时，不能有search.html。
它将返回对刚刚打开的窗口的引用。从那里，您可以获取该窗口的
文档
对象，并根据需要对其进行写入/更新

我无法为您提供可运行的代码段，因为在该上下文中禁止使用window.open，但您只需在浏览器控制台中运行以下命令即可：

var newWin = window.open('', '') //a blank page
newWin.document.write('HI THERE!')

这就是您的代码中缺少的内容。；）
 我得到了教授的反馈。
他希望我们使用sessionStorage将搜索结果传递到另一个页面

谢谢每一位试图帮助我的人

这是一项学校作业，你想让我们帮你解决吗？那么你会学到什么？：）我已经提交了作业。我不想让它解决，我想学习如何去做。我要的是提示，不是解决方案！“如果有任何提示或批评，我将不胜感激。”为什么我要复制/粘贴准确的作业说明和我的真实姓名？我的教授并不笨，我是在开玩笑。您需要的是访问已打开窗口的
文档
，并在其中进行操作。我不知道
search.html
有什么功能，您可以修改DOM内容，或者创建一个空白页面，然后在其中创建结果。：）你们能给出一些要搜索的样本数据吗？用假dbI编辑过，但没用。search.js:7 Uncaught DomeException:未能对“历史记录”执行“pushState”：一个URL为的历史记录状态对象file:///E:/Dropbox/School/COP2803/assignment_3/search.html“无法在来源为“null”且URL为的文档中创建”file:///E:/Dropbox/School/COP2803/assignment_3/index2.html'.     在displaySearch(file:///E:/Dropbox/School/COP2803/assignment_3/js/search.js:7:20)在HTMLButtonElement.doSearch(file:///E:/Dropbox/School/COP2803/assignment_3/js/search.js:16:5)displaySearch@search.js:7 doSearch@search.js:16严重吗？为什么不干脆展示一下呢？这对我来说没有意义。
//Search
var result = "Nothing found!";

function displaySearch() {
    "use strict";

    var displayResult = document.getElementById("displayResult");

    window.open("search.html") //How do I display the result in this page?

    displayResult.style.display = "block";
    displayResult.innerHTML = result;
}

function doSearch() {
    "use strict";

    var searchField = document.getElementById("searchField").value;

    for (var i = 0; i < db.length; i++) {
        if (db[i].artist.toUpperCase() === searchField.toUpperCase()) {
            result = db[i].artist;
        }
    }

    displaySearch();

}

function search() {
    "use strict";

    var searchButton = document.getElementById("searchButton");
    searchButton.addEventListener("click", doSearch, false);
}

window.addEventListener("load", search, false);

var db = []; //array of fake album database

function Album(id, title, artist, price, relDate, qty, tracks) {
    "use strict";
    this.id = id;
    this.title = title;
    this.artist = artist;
    this.price = price;
    this.relDate = relDate;
    this.qty = qty;
    this.tracks = tracks;
    db.push(this);
}

var album1 = new Album("01", "Animals", "Pink Floyd", 18.99, "01/23/1977", 1000, ["1. Pigs on the Wing 1", "2. Dogs", "3. Pigs (Three Different Ones)", "4. Sheep", "5. Pigs on the Wing 2"]);

var album2 = new Album("02", "Cosmic Slop", "Funkadelic", 19.99, "07/09/1973", 500, ["1. Nappy Dugout", "2. You Can’t Miss What You Can’t Measure", "3. March to the Witch’s Castle", "4. Let’s Make It Last", "5. Cosmic Slop", "6. No Compute", "7. This Broken Heart", "8. Trash A-Go-Go", "9. Can’t Stand the Strain"]);

var album3 = new Album("03", "Ghost Reveries", "Opeth", 14.99, "08/29/2005", 1500, ["1. Ghost of Perdition", "2. The Baying of the Hounds", "3. Beneath the Mire", "4. Atonement", "5. Reverie/Harlequin Forest", "6. Hours of Wealth", "7. The Grand Conjuration", "8. Isolation Years"]);

//Search
var result = "Nothing found!";

function displaySearch() {
    var displayResult = document.getElementById("displayResult");
     window.history.pushState({},"Test","search.html");//fake redirect
    document.body.innerHTML = result;//clear all content (trough overriding) + add results
}

function doSearch() {
    var searchField = document.getElementById("searchField").value;

    result=db.filter(el=>el.artist.toUpperCase()===searchField.toUpperCase()).map(el=>el.artist).join("<br>");
    //     filter trough than get the artists name and create a html string out of that array
    displaySearch();

}

function search() {
    document.getElementById("searchButton").addEventListener("click", doSearch, false);
}

window.addEventListener("load", search, false);

var newWin = window.open('', '') //a blank page
newWin.document.write('HI THERE!')