使用JS引用对象窗口的元素id

Question

我使用template.html文件存放标题＆amp;菜单栏并使用JS插入每个index.html文件的页面内容。我在我的根文件中放置了template.html，子文件夹包含一个index.html（它将template.html作为对象引入）和script.js。

我需要index.html文件来加载script.js文件，同时仍然将script.js文件应用于template.html文件，但无法弄清楚如何在index.html对象中包含JS引用。我之前seen something done喜欢这样的iframe，但无法让它以相同的方式应用于对象元素。

以下是缩短的文件：

template.html

<!-- header & menu html -->
<div>
  <div id="middleLeft"></div>
  <div id="middleRight"></div>
</div>

引用/ index.html中

<object type="text/html" data="../template.html"></object>

引用/的script.js

jQuery(function ($) {

window.onload = function() {
  $('#middleRight').innerHTML = rightText;
  $('#middleLeft').innerHTML = leftText;
}

var leftText = "<p>left text</p>";
var rightText = "<p>right text</p>";

原样，script.js只有在template.html中加载时才有效，但需要在index.html中加载。有没有办法在index.html中加载它，但仍然让它引用template.html对象中的元素？谢谢你的帮助！