Javascript-更改对象数据源_Javascript_Html

Javascript-更改对象数据源

javascript html

Javascript-更改对象数据源,javascript,html,Javascript,Html,我不确定这是否可能我想制作一个相同的页眉和页脚，但内容页面不同。我目前的课程只涉及HTML、JS、CSS和JQuery 这是我现在的身体，简化了： <div id="header"> <ul> <li><a href="#" onclick="contentOne()">Content One</a></li> <li><a href="#" onclick="content

我不确定这是否可能

我想制作一个相同的页眉和页脚，但内容页面不同。我目前的课程只涉及HTML、JS、CSS和JQuery

这是我现在的身体，简化了：

<div id="header">
   <ul>
      <li><a href="#" onclick="contentOne()">Content One</a></li>
      <li><a href="#" onclick="contentTwo()">Content Two</a></li>
   </ul>
</div>

<div id="contents">
   <object id="change" data="contentOne.html" type="text/html" height="100%" width="100%">
   </object>
</div>
<div id="footer">
   <p>The footer</p>
</div>






页脚

头部内部是这样的：

<head>
   <script>
      function contentOne(){
         document.getElementById("change").data = "contentOne.html";
      }

      function contentTwo(){
         document.getElementById("change").data = "contentTwo.html";
      }
   </script>
</head>


函数contentOne（）{
document.getElementById（“change”）.data=“contentOne.html”；
}
函数contentTwo（）{
document.getElementById（“change”）.data=“contentTwo.html”；
}

问题是，我无法更改内容。它看起来可以工作，但是，例如，单击

ContentTwo

，不会加载

ContentTwo

。页面保持不变。

对于本机JS，应使用

setAttribute

；对于jquery，应使用

.prop

：

 function contentOne(){
        // native
        var element =  document.getElementById("change");
        element.setAttribute("data", "contentOne.html");

        // jquery
        $("#change").prop("data","contentOne.html");
      }

确保正确关闭属性值，

height=“100%width=“100%>

错误，并且

对象

元素应使用

关闭：

 <object id="change" data="contentOne.html"  
     type="text/html" height="100%" width="100%"></object>

对于本机JS，应使用

setAttribute

；对于jquery，应使用

.prop

：

 function contentOne(){
        // native
        var element =  document.getElementById("change");
        element.setAttribute("data", "contentOne.html");

        // jquery
        $("#change").prop("data","contentOne.html");
      }

确保正确关闭属性值，

height=“100%width=“100%>

错误，并且

对象

元素应使用

关闭：

 <object id="change" data="contentOne.html"  
     type="text/html" height="100%" width="100%"></object>

data属性作为

object

元素上的

data

属性公开。使用setAttribute测试了它，真是糟透了！我想知道为什么它以前不起作用？我不能直接用.data=“contentOne.html”@orewaaf更改它吗？如果您使用的是什么浏览器？根据上面的链接，规范要求设置

data

属性应与设置

data

属性相同。您正在使用的浏览器可能有缺陷，需要进行缺陷报告归档。

数据

属性作为

对象

元素上的

数据

data

属性应与设置

data

属性相同。您使用的浏览器可能有缺陷，需要提交缺陷报告。@Teemu我无法更改内容。它看起来可以工作，但是，例如，单击ContentTwo不会加载ContentTwo。这一页仍然是第一页same@Teemu我无法更改内容。它看起来可以工作，但是，例如，单击ContentTwo不会加载ContentTwo。页面保持不变