在这里,我正在尝试打开并获取一个div的内容来定位div,点击href.
在这里我有一个表,我有hrefs有链接到div ids,我有一个目标div是空的.
在这里我有一个表,我有hrefs有链接到div ids,我有一个目标div是空的.
当我点击href链接时,链接的div内容应该在目标div中打开.
例如：
对于链接fea1我已经链接ID#m1,当我点击fea1,#m1内容应该出现在目标div.
我该怎么办？
这是我的代码：
HTML：
<!DOCTYPE html>
<html>
<head>
<title>
Example
</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<table border="0">
<tr>
<td>
<hr>
<a href="#m1">
fea1
</a>
<br>
<hr>
<a href="#m2">
fea2
</a>
<br>
<hr>
<a href="#m3">
fea3
</a>
<br>
<hr>
<a href="#m4">
fea4
</a>
<br>
<hr>
<a href="#m5">
fea5
</a>
<br>
<hr>
<a href="#m6">
fea6
</a>
<br>
<hr>
<a href="#m7">
fea7
</a>
<br>
<hr>
<a href="#m8">
fea8
</a>
<br>
<hr>
<a href="#m9">
fea9
</a>
<hr>
</td>
</tr>
</table>
<div class="target">
</div>
<div id="m1">
dasdasdasd
</div>
<div id="m2">
dadasdasdasd
</div>
<div id="m3">
sdasdasds
</div>
<div id="m4">
dasdasdsad
</div>
<div id="m5">
dasdasd
</div>
<div id="m6">
asdasdad
</div>
<div id="m7">
asdasda
</div>
<div id="m8">
dasdasd
</div>
<div id="m9">
dasdasdsgaswa
</div>
</body>
</html>
CSS：
a{
text-decoration:none;
color:black;
}
.target{
width:50%;
height:200px;
border:solid black 1px;
}
#m1,#m2,#m3,#m4,#m5,#m6,#m7,#m8,#m9{
display:none;
}
解决方法
您可以将所有#m1 …#m9 divs放入.target,并使用
:target伪类基于片段标识符(散列)显示它们.它不会在div之间移动内容,但我认为效果接近于您想要实现的效果.
HTML
<div class="target">
<div id="m1">
dasdasdasd m1
</div>
<!-- etc... -->
<div id="m9">
dasdasdsgaswa m9
</div>
</div>
CSS
.target {
width:50%;
height:200px;
border:solid black 1px;
}
.target > div {
display:none;
}
.target > div:target{
display:block;
}
