【无标题】180-187笔记1月19日李游精品前端课程笔记
2024-04-24 17:09:25
180.使用JS获取节点名称<script type="text/javascript">onload=function(){var divNode=document.getElementsByTagName("div");//获取所有div的标签；console.log(divNode);//输出：objct//如果需要取出某个元素：用下标的方式选中console.log(divNode[0]);//输出：<div>llkjlkj</div>
};</script>
</head>
<body><div >llkjlkj</div><div>lkdfdf</div><div>sfgdfg</div>
</body>
</html>181.使用JS查找class元素
<script type="text/javascript">onload=function(){var abc=document.getElementsByClassName("abc");//打印的结果跟标签选择如出一辙。console.log(abc);console.log(abc[0]);console.log(abc.length);
};</script>
</head>
<body><div class="abc">llkjlkj</div><div class="abcd">lkdfdf</div><div class="abcde">sfgdfg</div><div class="abc">kjoiuoj</div><div class="abc">kjoiuoj</div><div class="abc">kjoiuoj</div><div class="abc">kjoiuoj</div><div class="abc">kjoiuoj</div>
</body>
</html>182.JS中的if-else语句
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title></title><style type="text/css">#myDiv{width: 100px;height: 100px;background-color: red;}</style><script type="text/javascript">//if-else 是JS常用的逻辑判断语句；// if (判断条件){执行的程序}；//else{如果不满足判断条件执行else}onload=function(){// var a=1;// if(a==3){// alert('对了');// }// else{// alert("错了");// };//使用判断来改变元素的样式// var b=0;// btn.onclick=function(){// b++;// if(b==3){// document.body.style.background="red";// };// };// };//使用判断来控制元素的显示与隐藏var c=0;btnTwo.onclick=function(){c++;if(c%2==1){myDiv.style.display="none";}else{myDiv.style.display="block";};};};</script>
</head>
<body><!--<input type="button" name="" id="btn" value="+">--><input type="button" name="" value="显示/隐藏" id="btnTwo"><div id="myDiv"></div>
</body>
</html>183.练习题-登录检测用户名密码状态
<body><input type="text" name="" id="t"><input type="text" name="" id="p"><input type="button" name="" value="提交" id="b"><script type="text/javascript">//一定要看几遍，这个有点绕btn.onclick=function(){if (t.value==""){alert("请输入用户名");};else{if(p.value=;""){alert("请输入密码");}else{if(t.value[0]!="l"){alert("用户名首字母必须是:'l'");}else{if(t.value[1]!="e");{alert("用户名次字母必须是:'e'")}else{if(t.value[2]!="o"){alert("用户名的第三个字母必须是:'o'")}else{alert("you are sure")}}}}}};</script>
184.练习题-带遮罩层的功能框
185.185.JS中的else-if语句
<body><script type="text/javascript">var money=5,phone="phone";if(money==8){alert("卖你了");}//else if 可以增加判断的条件：else if(money==7){alert("也卖你了");}else if(money=="phone"){alert('拿手机还也可以');}else{alert("得了，卖不了你在琢磨一下")；}</script></body>
186.JS中的和的用法
script type="text/javascript">//&&连接判断条件，必须所有的判断的条件都必须满足；// var a=10;// var b=5;// var c=2;// var d="99a";// var e=11;// if (a==10 && b==5 && c==3 && d=="99a" && e==11 ){// alert("都对了");// }// else{// alert("至少有一个是不对的")// };//用&&做账户和密码的验证判断onload=function(){b.onclick=function(){//判断有户名和密码必须两个都不为空，才可以提示登录成功if(t.value!=''&&p.value!=""){alert("登录成功")}//如果任意一个条件不满足，则提示请输入用户名和密码else{alert("请输入用户名和密码")};};};</script>
</head>
<body><input type="text" name="" id="t"><input type="text" name="" id="p"><input type="button" name="" value="提交" id="b">
187.JS中的或的用法
|| ：if 判断连接符，表示多个条件只要有一个条件满足就为true
例子：
<script type="text/javascript">//&&连接判断条件，必须所有的判断的条件都必须满足；// var a=10;// var b=5;// var c=2;// var d="99a";// var e=11;// if (a==5 || b==4 || c==4 || d=="9a" || e==11 ){// alert("只要对了一个就可以");// }// else{// alert("一个都没对")// };//用||做账户和密码的验证判断onload=function(){b.onclick=function(){//判断有户名和密码必须两个有一个为空，提示用户名或密码为空if(t.value==''||p.value==""){alert("用户名或者密码为空")}//否则，可以提示用户登录成功else{alert("登录成功")};};};</script>
</head>
<body><input type="text" name="" id="t"><input type="text" name="" id="p"><input type="button" name="" value="提交" id="b">【无标题】180-187笔记1月19日李游精品前端课程笔记相关推荐
- 【无标题】169-179笔记1月18日李游精品前端课程
169.操作元素的基本流程 一．JS操作元素的基本方法 *因为JS放在文档的最上面,所以要使用window.onload,在页面加载完成后运行JS的代码. 二．操作body标签示例 <scrip ...
- 01网易云首页导航栏html制作（李游精品前端课程笔记）
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 377-379自制mac系统 （李游精品前端课程笔记）
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 01网易首页静态页面笔记（李游精品前端课程）
首先cs样式布局都是按照老师讲解的课程一步一步写完 *{margin: 0;padding: 0;list-style: none;text-decoration: none;} /* topNode ...
- 【无标题】2022年10月22日 20点 程序爱生活 纳指和恒指反弹的概率还在,但是反弹做空为主。敏感因子第一次出现折价缩小，或许春天不太远，还需要观察！
确定市场形态的敏感因子 - 第一次折价不再扩大 结论:市场进入了有部分资金看多的情况,趋势有点不同了,但是也要继续观察是否折价会持续缩小,现在判断可能还是有点早. 但是的确是一个好消息. 我感觉最有 ...
- 12月19日 OpenCV 实战基础学习笔记——特征匹配
文章目录 前言 一.特征匹配 1.Brute-force 蛮力匹配 2.1 对 1 匹配 3.k 对最佳匹配 二.答题卡识别 前言 本文为12月19日 OpenCV 实战基础学习笔记--特征匹配,分为 ...
- 分享Silverlight/WPF/Windows Phone一周学习导读(8月15日-8月19日)
分享Silverlight/WPF/Windows Phone一周学习导读(8月15日-8月19日) 本周Silverlight学习资源更新: Silverlight Tools 4安装时的错误提示 ...
- 2020年阴阳师服务器维护,2020阴阳师2月19日更新官方公告及内容汇总
小编今天给各位玩家朋友们带来的是2020阴阳师2月19日更新官方公告及内容汇总,阴阳师今天进行了版本更新,大家期待已久的超鬼王活动也是正式上线了,那么还有哪些精彩的活动?哪些新的内容呢?相信不少的玩家 ...
- 贪婪洞窟2服务器维护,12月19日贪婪洞窟2停服维护公告 贪婪洞窟2更新了什么
原标题:12月19日贪婪洞窟2停服维护公告 贪婪洞窟2更新了什么 斗玩网(douwan.com)报道:12月19日贪婪洞窟2发布维护公告,此次停服维护主要针对游戏中出现的bug以及优化游戏,一起来看看 ...
最新文章
- 使用Python PIL库实现简单验证码的去噪处理
- java 之 运算符
- 数据处理算法链接 DATA MINING GA LINK
- 【图解数据结构】二叉查找树
- 《深入解析 MAC OS X iOS 操作系统》PDF 带书签
- .NET core2.0 发布至IIS中
- Nikitosh 和异或 —— 一道 trie 树的题用可持久化 trie 水 然后翻车了...
- java fx 多个窗口_JavaFX Scene Builder（窗口各种设置）
- gui界面设计心得体会 python_关于GUI的一点心得体会
- 电脑也能管理服务器安全 安全狗服云PC端V2.3发布
- jQuery设置iframe的高度根据页面内容自适应
- C语言 “fread” 和 “fwrite”的简单介绍
- 3G时代日本手机咸鱼难翻身
- 简述hdfs工作原理_HDFS 原理简述
- 多旋翼无人机动力、运动学建模及仿真
- 十二款硬盘数据恢复软件，百分之九十五的人没听过！
- Luogu P1725 琪露诺
- java+svm多分类器_svm多分类的java源码
- 微信小程序苹果手机statusBarHeight状态栏高度为0
- /system32/ntoskrnl.exe丢失无法启动