博客列表 >javascript-基础(五)

javascript-基础(五)

CY明月归
CY明月归原创
2022年04月07日 23:54:50344浏览

作业内容:

1. 实例演示classList对象
  1. let a = document.querySelector('.box')
  2. console.log(a.className)
  3. // contains(): 判断
  4. // remove()移除
  5. // replace(): 替换
  6. // toggle(): 动态切换class
  7. a.classList.contains('a1')
  8. a.classList.toggle('a1');
  9. a.classList.add('b1')
  10. a.classList.remove('b1')
  11. a.classList.replace('b1','b2')
  12. a.classList.toggle('b1')
2. 使用blur事件进行表单非空验证

  1. <form action="" method="post" id="login">
  2. <label class="title">用户登录</label>
  3. <label for="email">邮箱:</label>
  4. <input type="email" id="email" name="email" value="" onblur="check(this)" />
  5. <label for="password">密码:</label>
  6. <input type="password" id="password" name="password" onblur="check(this)"/>
  7. <button name="submit" onclick="check()">登录</button>
  8. </form>
  9. <script>
  10. function check(ele){
  11. event.preventDefault();
  12. event.stopPropagation()
  13. if(ele.id == 'email' && ele.value==0){
  14. alert('请检查邮箱')
  15. }
  16. if(ele.id == 'password' && ele.value==0){
  17. alert('请检查密码')
  18. }
  19. };
  20. </script>
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议