如果您点击我,我会消失。
点击我,我也会消失
也要点击我哦
>如上图,是三个<p>标签元素里面的内容,如果点击其中任意一个,该元素就会隐藏,如果用JavaScript实现。代码如下
</pre><p></p><p>如上图,是三个<p>标签元素里面的内容,如果点击其中任意一个,该元素就会隐藏,如果用JavaScript实现。代码如下</p><p></p><p></p><pre name="code" class="html"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery</title>
<script>
function loading()
{
var elements = document.getElementsByTagName("p");
for(var i=0;i<elements.length;i++)
{
elements[i].onclick=function(){XiaoShi(this)}
}
}
function XiaoShi(element)
{
element.style.visibility="hidden";
}
</script>
</head>
<body onload="loading()">
<p>如果您点击我,我会消失。</p>
<p>点击我,我也会消失</p>
<p>也要点击我哦</p>
</body>
</html>
如果用jQuery的话,代码大大简化了,如以下代码:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
</body>
</html>