博客列表 >【事件】-JavaScript

【事件】-JavaScript

迷途何必知返
迷途何必知返原创
2018年11月06日 20:05:15876浏览
<!DOCTYPE html>
<html>
<head>
	<title>点击某个元素时改变另一个元素的属性该怎么做呢?</title>
</head>
<style type="text/css">
.content{ width: 1300px; margin: 0 auto; background: pink; height: 600px; }
.content ul { list-style: none; }
.content ul li{ width: 300px; height: 300px; background: #ccc; border: 1px solid #fff; float: left;list-style: none;text-align: center; }
.cilck { line-height: 300px;  font-size: 16px; }
.mynone{display: none;line-height: 300px; text-align: center; font-size: 16px;}
</style>

<body>
<script type="text/javascript">
  //点击某个元素时改变自己的属性的写法更具老师的写法我会写了。
  // 但是我想实现鼠标点击时  隐藏第一个span 第二个span显示出来 该怎么实现呢
   function mycontent(x){
   	 //还有这里的点击一个元素时改变另一个的写法不知道怎么写了
     x.style.display='block'
   }
</script>
<div class="content">
   <ul>
   <!-- 这里的函数调用位置不知道写在哪里 -->
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
    <li><span class="cilck">点击抽奖</span><span class="mynone">谢谢参与</span></li>
   </ul>
</div>
</body>
</html>


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议