Question

在我的index.html页上，我要求用户输入输入。然后，将创建一个带有其输入的按钮。单击该按钮将转到inside_goal.html。我希望该页面的标题等于按钮的名称。

这是要求用户输入的代码：

<body>
  <h1 id="home_header" style="font-family: optima; text-align: center"> Nancy Dong </h1>
  <div id="enter.goal">
    <form id="subBox" onsubmit="createButton(); return false;">
      <input type="text" , id="goal">
      <input type="submit" , value="Enter Goal">
    </form>
  </div>
  <div id="space_holder" style="top = 50px; left: 50px;">
  </div>
  <script src='timer.js'>
  </script>
  <script src='name.js'></script>
</body>

这是在用户输入名称（在index.html内）上创建按钮的方式的代码：

function createButton() {
  var x = document.createElement("BUTTON");
  x.className = "second";
  x.id = "first";
  var name = document.querySelector("#goal").value;
  var t = document.createTextNode(name);
  x.appendChild(t);
  document.getElementById("space_holder").appendChild(x);
  var insideclass = document.getElementsByClassName("second");
  insideclass[counter].innerHTML = `<input type="button" onclick="location.href='inside_goal.html';" value="${name}" />`;
  counter = counter + 1;
  document.querySelector("#goal").value = "";

现在的问题是我找不到将#goal放入inside_goal.html的方法。我尝试过：

document.getElementById("h1").innerHTML =  $('#goal').load("index.html");

但仅打印[object Object]

我也尝试过：

$.get( "index.html", function(test) {
  $( "#h1" ).html( test );
  alert( "Load was performed." );
});

如何仅访问#goal的{{1}}部分，而不能在index.html上显示整个HTML页面？

Answer 1

您正在使用jquery load（）错误。如果#goal位于第一个html文件（index.html）中，则应为：

$("selector_in_2nd_page").load("index.html #goal");

从一个HTML元素访问另一个HTML元素

1 个答案: