![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：这些基本的动画还是很简单的吧
Collection
Collection
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>jQuery事件</title><script src="jquery-3.4.1.min.js"></script><style>#phpcn{background-color: #0C9A9A;border-radius: 2px;padding: 20px;}button{background-color: #0E9A00;border: 0;border-radius: 2px;padding: 10px;margin-top: 5px;}</style></head><body><button id="btn1">按钮1</button><button id="btn2">按钮2</button><button id="btn3" onclick="offw()">移除button所有事件</button><button id="btn4" onclick="onew()">ONE</button></body><script>//one 第一次点击先添加元素 第二次点击时执行function onew(){$('button').one('click',function () {$('#btn4').after('<p id="phpcn">php</p>');})}//移除指定类元素事件function offw(){$('button').off()}$('#btn1').on('click',function () {alert('按钮1被点击了')});$('#btn2').on( "click", function() {alert($( this ).text() + '666' );});</script></html>
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>jQuery动画</title><script src="jquery-3.4.1.min.js"></script><style>#phpcn{background-color: #0C9A9A;border-radius: 2px;padding: 20px;}button{background-color: #0E9A00;border: 0;border-radius: 2px;padding: 10px;margin-top: 5px;}</style></head><body><div id="nav"><p>AA</p><p>BB</p><p>CC</p></div><button onclick="hidet()">隐藏#NAV</button><button onclick="showt()">显示#NAV</button><button onclick="slideUpt()">滑动隐藏#NAV</button><button onclick="slideDownt()">滑动显示#NAV</button><button onclick="slideTogglet()">滑动显示+隐藏#NAV</button><button onclick="fadeInt()">淡入显示#NAV</button><button onclick="fadeOutt()">淡出隐藏#NAV</button></body><script>//淡出隐藏 fadeOutfunction fadeOutt() {$('#nav').fadeOut(1000);}//淡入显示 fadeInfunction fadeInt() {$('#nav').fadeIn(1000);}//滑动显示+隐藏 slideToggletfunction slideTogglet() {$('#nav').slideToggle();}//滑动显示 slideDowntfunction slideDownt() {$('#nav').slideDown();}//滑动隐藏 slideUpfunction slideUpt() {$('#nav').slideUp();}//隐藏 hidefunction hidet() {$('#nav').hide();}//显示 showfunction showt() {$('#nav').show();}</script></html>
