1:引用插件jquery-3.2.1.min.js:
2:为了方便看出效果和美观,在外层放一个div盒子,给这个盒子设置一些样式:
比如边距,边框,宽,高,文本居中等等:
style=“margin:10%auto;border:1pxsolid rgba(48,211,203,1.00);width:60%;line-height:100px;text-align: center;”
3:先拿p标签做个示范吧,比如在刚刚那个div盒子中放几个p标签,给上不同的字体颜色。然后再写js代码:首先,写页面加载事件,跟原生的有些不同,你可以直接$(document).ready(function(){}),这样就相当于原生的那个页面加载事件了,其实也差不多,当然,如果你习惯写原生的也可以写原生的,然后再获取所有的p标签给它一个点击事件,点击p标签时,给它hide()(隐藏),这样就OK了,
点我试试,我会消失!
点我,我也会消失!
还有我,我也是
重新出现
//--新增的元素--// $(".iv").click(function(){ $("p").first().show();//--显示第一个P标签--// $(this).hide();//--隐藏本身--// }); 先看看把三个P标签都隐藏的效果截图: ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190628080817410.png) 从上图可以看出,现在已经把三个P标签都隐藏了,只剩下刚刚新增的那个元素,那么我再来看看当我点击新增元素时是否能把第一个P标签显示出来并隐藏自身呢 点击div元素显示被隐藏的第一个P标签和隐藏自身效果截图: ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190628080826439.png)