Javascript 如何打开<;细节>;从另一页中的链接

Javascript 如何打开<;细节>;从另一页中的链接,javascript,html,css,Javascript,Html,Css,假设我有一个主页,其中包含指向第二个页面的链接,该页面包含某种内容,例如元素。现在,第二页中的元素“默认”关闭,但我希望主页中的链接重定向到元素并打开它 我想用基本的html/css和javascript来解决这个问题。以下是我到目前为止的情况: home.html <html> <head> <script type="text/javascript"> window.onload = function() { var

假设我有一个主页,其中包含指向第二个页面的链接,该页面包含某种内容,例如
元素。现在,第二页中的
元素“默认”关闭,但我希望主页中的链接重定向到
元素并打开它

我想用基本的html/css和javascript来解决这个问题。以下是我到目前为止的情况:
home.html

<html>
  <head>
    <script type="text/javascript">
      window.onload = function() {
        var a = document.getElementById("mylink");
        a.onclick = function() {
          var b = document.getElementById("mydetails");
          b.open = true;
          b.style.color = "red"; // just to try another property
          return false;
        }
      }
    </script>
  </head>
  <body>
    <h1>Home Page</h1>
    <h2><a id="mylink" href="second_page.html#mydetails">Go to 2nd page</a></h2>
  </body>
</html>

window.onload=函数(){
var a=document.getElementById(“mylink”);
a、 onclick=function(){
var b=document.getElementById(“mydetails”);
b、 开放=真实;
b、 style.color=“red”//只是尝试另一个属性
返回false;
}
}
主页
第二页.html

<html>
  <body>
    <h1>2nd page</h1>
    <details id="mydetails" open="false">
      <summary>Hello,</summary>
    </details>
  </body>
</html>

第二页
你好
不幸的是,代码运行了,但是当我单击主页中的链接时,第二页中的
没有打开。我该怎么做呢

如果我可以将链接和目标元素的ID作为参数传递给JS函数,那么就可以获得额外的积分

相关问题:

  • ,从那里我得到了大部分代码
  • ,这似乎是我想要实现的,但我不知道如何让它发挥作用
  • 沿着这条思路应该会奏效。 这是在使用jquery,希望可以

    沿着这条思路应该会奏效。
    这是使用jquery,希望没问题。

    您不能使用Javascript修改另一个不活动的页面。Javascript只在活动页面上运行,可以修改活动页面的DOM。您必须将值发送到下一页

    用于发送数据的HTML5会话存储:

        home.html
        <script type="text/javascript">
            window.onload = function() {
                var a = document.getElementById("mylink");
                a.onclick = function() {
                    localStorage.setItem("open", "true");
                }
            }
        </script>
    
        second_page.html
        <script>
             var val = localStorage.getItem("open");
             if (val == "true") {
                 var b = document.getElementById("mydetails");
                 b.open = true;
                 b.style.color = "red";
                 localStorage.removeItem("open");
              }
        </script>
    
    home.html
    window.onload=函数(){
    var a=document.getElementById(“mylink”);
    a、 onclick=function(){
    setItem(“打开”、“真实”);
    }
    }
    第二页.html
    var val=localStorage.getItem(“打开”);
    如果(val=“true”){
    var b=document.getElementById(“mydetails”);
    b、 开放=真实;
    b、 style.color=“红色”;
    localStorage.removietem(“打开”);
    }
    
    不能使用Javascript修改另一个未激活的页面。Javascript只在活动页面上运行,可以修改活动页面的DOM。您必须将值发送到下一页

    用于发送数据的HTML5会话存储:

        home.html
        <script type="text/javascript">
            window.onload = function() {
                var a = document.getElementById("mylink");
                a.onclick = function() {
                    localStorage.setItem("open", "true");
                }
            }
        </script>
    
        second_page.html
        <script>
             var val = localStorage.getItem("open");
             if (val == "true") {
                 var b = document.getElementById("mydetails");
                 b.open = true;
                 b.style.color = "red";
                 localStorage.removeItem("open");
              }
        </script>
    
    home.html
    window.onload=函数(){
    var a=document.getElementById(“mylink”);
    a、 onclick=function(){
    setItem(“打开”、“真实”);
    }
    }
    第二页.html
    var val=localStorage.getItem(“打开”);
    如果(val=“true”){
    var b=document.getElementById(“mydetails”);
    b、 开放=真实;
    b、 style.color=“红色”;
    localStorage.removietem(“打开”);
    }
    
    谢谢,成功了!我还有一个额外的问题:如果我从
    元素中删除
    open=“false”
    ,为什么它不再有效?@PierPaolo你的意思是这样的
    ?如果没有
    open
    属性???@PierPaolo,它将无法工作,因为没有像
    open
    这样的属性可以修改。谢谢,它成功了!我还有一个额外的问题:如果我从
    元素中删除
    open=“false”
    ,为什么它不再有效?@PierPaolo你的意思是这样的
    ?如果没有
    open
    属性???@PierPaolo,它将无法工作,因为没有像
    open
    这样的属性可以修改。最后,我选择了我更熟悉的解决方案,但还是感谢您的帮助!最后,我选择了我更熟悉的解决方案,但还是感谢您的帮助!