Html 如何在目标div中打开链接_Html

Html 如何在目标div中打开链接

html

Html 如何在目标div中打开链接,html,Html,我想在页面的“right_side”div中显示home.html页面的内容。我该怎么做 link.html----------------------- <html> <head> <title>Link Example</title> </head> <body> <div id="left_side"> <a href="home.html" >Home</a> <a href

我想在页面的“right_side”div中显示home.html页面的内容。我该怎么做

link.html-----------------------

<html>
<head>
<title>Link Example</title>
</head>
<body>
<div id="left_side">
<a href="home.html" >Home</a>
<a href="products.html" >Home</a>
</div>
<div id="right_side">
</div>                                    
</body>
</html>


链接示例

假设您需要动态解决方案：您可以使用类似jQuery的东西来检索home.HTML文件的HTML/DOM，然后将home.HTML中的相关DOM子树插入到#right_side div中

否则（非动态）：

只需复制并粘贴内容。但我认为这太微不足道了。

您可以简单地使用iframe而不是div。放

代替你右边的潜水器

并将

替换为


使用Ajax。写这样的东西
 <a href="javascript: loadXMLDoc();" >Home</a

听起来你需要使用。这个问题现在有很多答案。虽然我不是版主或任何人，但我要求你接受最适合你的答案，或在评论中讨论，以获得最终答案。ID
s和names共享同一名称空间。我尝试了你的代码，但当我单击home时……它不会显示任何内容。请使用jquery链接重试。
 <a href="javascript: loadXMLDoc();" >Home</a

<html>
<head><script type="text/javascript" src="[http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js]"></script>
<title>Link Example</title>
<script type="text/javascript">
    function loadXMLDoc() {
        var xmlhttp;
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function() {
            if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                document.getElementById("right_side").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("POST","home.html",true);
    xmlhttp.send();
}
</script></head>
<body>
    <div id="left_side">
        <a href="javascript:loadXMLDoc()" >Home</a>
        <a href="products.html" >Home</a>
    </div>
    <div id="right_side">
    </div>                                    
</body>
</html>