Question

我正在尝试实现类似的功能，www.example.com / en / test / page.html将加载www.example.com/2.html的框架集。

我能做到的。

但现在，在框架集中加载2.html后，我想将.html"替换为.html" target="_top"。

这样2.html中的所有链接都将在父窗口中打开而不是框架集本身。

<!DOCTYPE html">
<html lang='en' xml:lang='en' xmlns="http://www.w3.org/1999/xhtml">
    <head>
            <meta charset="utf-8" />
                    <title>Test Page</title>
                            <script> 
                            (function divert()
                                    {
                                    var urlString = parent.document.URL;
                                    var a1 = new RegExp("/en/test/page");
                                    if(a1.test(urlString))    {document.write('<frameset cols="100%" rows="100%"><frame src="http://www.example.com/2.html"></frameset>');}
                                    else{document.write('<frameset cols="100%" rows="100%"><frame src="http://www.example.com/3.html"></frameset>');}

                                    var str = document.getElementById("demo").innerHTML; 
                                    var res = str.replace('.html"', '.html" target="_top"');
                                    document.getElementById("demo").innerHTML = res;
                                    })();
                            </script>
    </head>
    <body onLoad="divert()"></body>

Answer 1

嗨@Vinod你可以使用target="_parent"如果你只有2级的框架集或者只想打开父框架的链接..

或者要打开指向当前页面的链接，您可以使用target="_top"

您可以阅读更多相关信息here

<强>更新

您还可以使用JavaScript来检测页面是否在框架内加载，而不是以实际方式将链接添加到链接中。

您可以使用window.location.origin和parent.window.location.origin来检测您是否在框架中

并且您可以使用以下代码使用JavaScript添加目标

使用jquery：

$(document).ready(function(){
  $('#link_other a').attr('target', '_blank');
});

不使用jquery

window.onload = function(){
  var anchors = document.getElementById('link_other').getElementsByTagName('a');
  for (var i=0; i<anchors.length; i++){
    anchors[i].setAttribute('target', '_blank');
  }
}

Answer 2

<!DOCTYPE html">
<html lang='en' xml:lang='en' xmlns="http://www.w3.org/1999/xhtml">
    <head>
            <meta charset="utf-8" />
                    <title>Test Page</title>
                            <script> 
                            (function divert()
                                    {
                                    var urlString = parent.document.URL;
                                    var a1 = new RegExp("/en/test/page");

                                function targetUrl(){
                                 var links = document.getElementById("demo").contentDocument.documentElement.getElementsByTagName('a');
                                 for(var i =0; i<links.length; i++){
                                 links[i].target = '_parent';}
                                }

                                    if(a1.test(urlString)){document.write('<frameset cols="100%" rows="100%"><frame id="demo" src="http://www.example.com/2.html"></frameset>');}
                                    else{document.write('<frameset cols="100%" rows="100%"><frame id="demo" src="http://www.example.com/3.html"></frameset>');}
                                    document.getElementById("demo").onload= targetUrl;
                                    })();
                            </script>
    </head>
    <body></body>
</html>

框架集innerHTML发生了变化

2 个答案: