html如何点击菜单之后页面的内容会改变_随笔

可以使用iframe，iframe内部是另外一个页面，在点击菜单的时候动态改变iframe的地址。

也可以使用页面路由，一般在vue,layui等框架可以使用路由切换页面内容显示。

还有就是可以使用自定义方法，在点击菜单的时候，更改页面当中的html，如："document.getElementById('content').innerHTML='页面内容2'"。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>无标题文档</title>

<style>

.main{ width:800pxheight:400pxborder:1px solid #999999border-bottom:none}

.top,.foot{ width:800pxheight:30pxborder-bottom:1px solid #999999}

.center{ width:800pxheight:339px}

.left{ width:200pxfloat:left}

.right{ width:600pxfloat:lefttext-align:centerheight:330px}

ul li{ list-style:noneborder:1px solid #999999margin-top:2px}

</style>

function showDiv(divid,rows,num){

for(i=1i<=rowsi++){

document.getElementById(divid+i).style.display="none"

}

document.getElementById(divid+num).style.display=""

}

</script>

</head>

<body>

<ul>

</ul>

</div>

</div>

</div>

</body>

</html>

欢迎分享，转载请注明来源：内存溢出

html如何点击菜单之后页面的内容会改变