设置<；对象>'；使用javascript/jQuery创建数据属性_Javascript_Jquery_Html

设置<；对象>'；使用javascript/jQuery创建数据属性

javascript jquery html

设置<；对象>'；使用javascript/jQuery创建数据属性,javascript,jquery,html,Javascript,Jquery,Html,所以，我试图在一个div中显示一个网页，点击该网页的链接单击链接时，我会阻止浏览器访问该链接，显示div，并为div内的提供所单击链接的url div显示，这一切都很好，并且对象获取单击链接的url作为其数据属性的值我的问题是没有显示任何内容。根据开发工具，它在那里，但我没有看到网页以下是我的javascript/jQuery代码： $('a').click(function(event){ event.preventDefault(); $('#tabViewWindow').s

所以，我试图在一个div中显示一个网页，点击该网页的链接

单击链接时，我会阻止浏览器访问该链接，显示div，并为div内的

提供所单击链接的url

div显示，这一切都很好，并且对象获取单击链接的url作为其数据属性的值

我的问题是

没有显示任何内容。根据开发工具，它在那里，但我没有看到网页

以下是我的javascript/jQuery代码：

$('a').click(function(event){
    event.preventDefault();
$('#tabViewWindow').show();
$('#tabViewWindow object').attr('data', $(this).attr('href'));
$('#tabVieWindow embed').attr('src', $(this).attr('href'));
});

下面是我在本地运行时出现问题的文件的完整代码：

<!Doctype HTML>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Tab View</title>
    <style type="text/css">
    html, body{
        height:100%;
        width:100%;
        margin:0;
        padding:0;
    }
    #tabViewWindow{
        height:100%;
        height:100vh;
        width:100%;
        width:100vw;
        position:absolute;
        background:#000000;
        display:none;
        left:0;
        top:0;
        z-index:10000000000000000;
    }
    embed, object, iframe, img{
        max-width:100%;
        margin:0 auto;
        display:block;
    }
    object{
        height:100%;
        width:100%;
    }
    </style>
    </head>
    <body>
        <div id="tabViewWindow">
            <object data="">
                <embed src="" />
            </object>
        </div>
        <br />
        <br />
        <a href="http://wolfram.com">Wolfram.com</a>
        <br />
        <br />
        <a href="http://wikipedia.org">Wikipedia.org</a>
        <br />
        <br />
        <a href="http://google.com">Google.com</a>
        <br />
        <br />

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript">
        $('a').click(function(event){
            event.preventDefault();
            $('#tabViewWindow').show();
            $('#tabViewWindow object').attr('data', $(this).attr('href'));
            $('#tabVieWindow embed').attr('src', $(this).attr('href'));
        });
        </script>
    </body>
</html>


选项卡视图
html，正文{
身高：100%；
宽度：100%；
保证金：0；
填充：0；
}
#选项卡视图窗口{
身高：100%；
高度：100vh；
宽度：100%；
宽度：100vw；
位置：绝对位置；
背景：#000000；
显示：无；
左：0；
排名：0；
z指数：100000000000000；
}
嵌入、对象、iframe、img{
最大宽度：100%；
保证金：0自动；
显示：块；
}
反对{
身高：100%；
宽度：100%；
}
















$（'a'）。单击（函数（事件）{
event.preventDefault（）；
$（'#tabViewWindow'）.show（）；
$（'#tabViewWindow object'）.attr（'data'，$（this.attr（'href'））；
$（'#tabVieWindow embed'）.attr（'src'，$（this.attr（'href'））；
});

使用iFrame，它可以工作（至少在FF和Chrome上，最新版本）-请参阅：

您想使用对象标记的原因是什么

顺便说一下，如果您只想在页面中显示另一个网站的片段，您可能会对iFrame感兴趣，它可以工作（至少在FF和Chrome上，最新版本）-请参阅：

您想使用对象标记的原因是什么

顺便说一句，如果你只是想在你的页面中显示另一个网站的片段，你可能会对你误用$（这）为什么不使用iframe感兴趣？@ScottSelby-解释，

$（这）

在这种情况下是

@ScottSelby-How$（此）
指的是本例中的锚。@Mistermelanchy我以为在HTML 5中不推荐使用iframe您误用了$（此）为什么不使用iframe？@ScottSelby-解释，$（此）
在该上下文中是@ScottSelby How$（此）
在本例中指的是锚定。@Mistermanchy，我以为在HTML 5I中Iframe不受欢迎，我选择了一个object标记，因为我认为在HTML5中，
不受欢迎。换句话说，不再应该被使用或支持。我不能起诉PagePeek，因为它们必须是实时的而不是屏幕截图。iFrame在HTML5中没有被删除，但原始的frame标记是。我选择了object标记，因为我认为在HTML5中被弃用。换句话说，不再应该被使用或支持。我不能起诉PagePeek，因为它们必须是实时的而不是屏幕截图。iFrame在HTML5中没有被去除，但原始的frame标签是。
<div id="tabViewWindow">
    <iframe></iframe>
</div>