多个innerHTML 函数

Question

<script language="JavaScript">
function changeHistory(which) {
document.getElementById('maincontent').innerHTML="<iframe src='history.html' width='100%' height='100%' scrolling='auto'></iframe>";
}

function changeFigures(which) {
document.getElementById('maincontent').innerHTML="<iframe src='figures.html' width='100%' height='100%' scrolling='auto'></iframe>";
}
</script>


<li><a title="History" href="history.html" onclick="changeHistory(this); return false;">History</a></li>
<li><a title="Figures" href="figures.html" onclick="changeFigures(this); return false;">Figures</a></li>

我做得对吗？如何不对不同的链接使用不同的 javascript 方法？

这个问题可以使用变量吗？

Answer 1

您已经使用这个内联函数将 html 元素传递给函数，我认为这种方式效果很好。

onclick="changeHistory(this);

现在，如果您像这样更改函数，您可以使用刚刚传递的 html 元素来获取实际的 url，即该 html 元素的“href”属性。

<script language="JavaScript">
function changeIframe(htmlElement) {
  document.getElementById('maincontent').innerHTML = "<iframe src='" + htmlElement.href + "' width='100%' height='100%' scrolling='auto'></iframe>";
}
</script>


<li><a title="History" href="history.html" onclick="changeIframe(this); return false;">History</a></li>
<li><a title="Figures" href="figures.html" onclick="changeIframe(this); return false;">Figures</a></li>

玩得开心！

Answer 2

是的，看起来不错，您可以这样做，将“href”从链接传递到 iframe 的 src。

function changeFrames(which) {

document.getElementById('maincontent').innerHTML="<iframe src='"+which.href+"' width='100%' height='100%' scrolling='auto'></iframe>";
}