1.单击图片显示图片边框
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>单击图片显示边框</title>
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
</head>
<body>
<div>
<img src="../初识jQuery/pic.gif">
</div>
</body>
<script>
$(function () {
$("img").click(function () {
$("img").css("border","1px solid black")
})
})
</script>
</html>
2.单击链接显示内容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>作品</title>
<style>
h1{
background: #333333;
color: #FFFFED;
text-align: center;
}
div{
text-align: center;
}
#a p:nth-of-type(1){
text-indent: 4em;
}
#a p:nth-of-type(2){
text-indent: 2em;
}
#a p:nth-of-type(3){
text-indent: -26em;
}
#a p:nth-of-type(4){
text-indent: 4em;
}
</style>
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
</head>
<body>
<h1 id="a">林微因简介</h1>
<div style="display: none" id="b">
<p>林徽因，女，汉族，原名林徽音，出生于浙江杭州，祖籍福建福州。中</p>
<p>国著名建筑家、诗人、作家。人民英雄纪念碑和中华人民共和国国徽深化方</p>
<p>案的设计者</p>
<p>林徽因是建筑师梁思成的第一任妻子。三十年代初，与夫婿梁思成用现</p>
<p>代科学方法研究方法研究中国古代建筑，成为这个学术领域的开拓者。</p>
</div>
<h1 id="d">主要作品</h1>
<div style="display: none" id="c">
<p>《你是人间四月天》</p>
<p>《宝莲灯》</p>
<p>《九十九度中》</p>
</div>
<script>
$(function () {
$("#a").click(function () {
$("#b").show();
})
$("#d").click(function () {
$("#c").show();
})
})
</script>
</body>
</html>