循环

for循环

  1. 语法
//1.int i=0; 初始化条件
//2.i<10 判断条件 会和初始化条件结合使用 决定了循环什么时候停止
//4.i++ 循环条件 每次循环体执行完毕 会让i产生变化
//i可以看作是一个局部变量
for(int i=0;i<10;i++){//3.循环体:循环在重复做的事情
}
  • 注意:当修改循环条件时 确保循环可以向着终点前进
  • 我们在开发中尽量避免死循环
  • 初始化条件只走一次

for循环的特殊写法(死循环)

//死循环
for(let i=0;i<10){console.log("i");
}
//死循环
for(let i=0;i++){console.log("i")
}
//死循环
for(let i=0){console.log("i")
}
//死循环
for(;;){console.log("i")
}

for循环结合数组

let arr=[0,1,2,3,4,5,6,7,8]for (let i = 0; i < arr.length; i++) {console.log(arr[i]);}
  1. 数组的长度:就是数组中有几个元素
  2. 把数组中的每个元素都操作一遍叫做数组的遍历 迭代

for in 循环

  1. 语法
for(let a in arr){console.log(a);
}
  1. 用于遍历数组

while循环

while循环

  1. while
let a=10;
while(条件表达式a<100){console.lot("while循环")a++;}
  1. 执行流程

    1. let a=10初始化条件
    2. a<100判断条件
    3. 执行循环体
    4. 步进表达式

do while 循环

  1. 语法
let a=10;//初始化条件
do{//做什么事a++;//步进表达式
}while(a>100)
  1. do while 和 while 的区别

    1. do while 是先执行一次在判断,
    2. while循环是条件不成立一次都不走
  2. js 的内置函数
    1. concat :连接数组
    2. join:设置分隔符连接数组为一个字符串
    3. pop:删除数组的最后一个元素
    4. parseInt():将小数转为整数(取整)不是四舍五入
    5. number():将一个数转为number类型
    6. parseFloat():将一个数转为小数
    7. string():把其他类型转为字符串
    8. charAt():取出指定位置的字符
    9. indexOf():判断指定的字符是否存在,存在就返回下标
    10. lastIndexOf:从后往前找
    11. replace(‘a’,‘b’):替换字符串
    12. split(“-”);根据参数去拆分字符串得到数组
    13. subString(1,6):根据参数下标进行字符串的截取
    14. cell():向上取整
    15. floor:向下取整
    16. round:四舍五入
    17. random:生成一个0-1的随机数
    18. getdata:返回日期的日 1-31 号
    19. getHourse():返回时间的小时
    20. getMinutes():返回时间的分
    21. getSeconds():返回时间的秒
    22. getTime():返回当前时间

获取控件

  1. 方法

    1. document.getElementById:根据id获取控件
    2. document.getElementsByClassName:根据class获取控件
    3. document.getElementsByTagName:根据标签获取控件
    
  2. 新方法:

    document.querySelector("可放id class 标签")//返回单个控件
    //如果相同class名称的控件有多个,默认选中第一个
    document.quarySelectorAll("可放id class 标签")//返回控件数组
    //获得单个控件需要如获取数组元素方法
    
  3. 获取控件的元素:

<input type"text" id="username"><script>let username=document.querySelector("#username");username.value//获取控件的值 还可以设置控件的valueusername.innerHTML//添加代码</script>

练习

  • 实现地区下拉条 ,三级下拉菜单连接

  • 思路:为第一个和第二个下拉菜单添加οnchange=""事件,获取下拉菜单控件,当控件中的值发生改变,就改变下一级的值

  • html代码

<select id="sheng" onchange="setshi()"><option>请选择省</option><option>吉林省</option><option>辽宁省</option></select><select id="shi" onchange="setqu()"><option>请选择市</option></select><select id="qu"><option>请选择区</option></select>
  • javascript代码
<script>function setshi(){let sheng=document.querySelector("#sheng").value;let shi=document.querySelector("#shi");let qu=document.querySelector("#qu");let shiValue =shi.valuelet quHtml=qu.innerHTMLhlet html=shi.innerHTML;if(sheng=='请选择省'){html="<option>请选择市</option>"shi.innerHTML=html;quHtml="<option>请选择区</option>"qu.innerHTML=quHtml;}if(sheng=='吉林省'){html="<option>请选择市</option><option>长春市</option><option>四平市</option>"quHtml="<option>请选择区</option>"qu.innerHTML=quHtml;shi.innerHTML=html;}if(sheng=='辽宁省'){html="<option>请选择市</option><option>沈阳市</option><option>大连市</option>"quHtml="<option>请选择区</option>"qu.innerHTML=quHtml;shi.innerHTML=html;}}function setqu(){let sheng=document.querySelector("#sheng").value;let shiValue =shi.valuelet qu=document.querySelector("#qu");let quHtml=qu.innerHTMLlet quValue=qu.valueif(shiValue=='请选择市'){quHtml="<option>请选择区</option>"qu.innerHTML=quHtml;}if(shiValue=='长春市'){quHtml="<option>请选择区</option><option>长春宽城区</option><option>长春二道区</option>"qu.innerHTML=quHtml;}if(shiValue=='四平市'){quHtml="<option>请选择区</option><option>四平铁西区</option><option>四平东铁区</option>"qu.innerHTML=quHtml;}if(shiValue=='沈阳市'){quHtml="<option>请选择区</option><option>沈阳大东区</option><option>沈阳浑南区</option>"qu.innerHTML=quHtml;}if(shiValue=='大连市'){quHtml="<option>请选择区</option><option>大连西岗区</option><option>大连沙河口区</option>"qu.innerHTML=quHtml;}}</script>
  • 难点:当改变省时,市和区都需要改变,改变市的时候区也需要改变

长春人文学院第四组孙乃宇https://blog.csdn.net/weixin_59347653?spm=1010.2135.3001.5421 js笔记相关推荐

  1. https://blog.csdn.net/wutianxu123/article/details/82597337

    web安全/渗透测试--1--web安全原则 版权声明:本文为博主原创文章,转载本站文章请注明作者和出处,请勿用于任何商业用途. https://blog.csdn.net/wutianxu123/a ...

  2. https://blog.csdn.net/watermelon_learn/article/details/88902117

    这里写自定义目录标题 第一次转载大神的文章,也是第一次发表csdn,有错大家请原谅. 华为2019年3月27日实习生笔试题及解答 第一次转载大神的文章,也是第一次发表csdn,有错大家请原谅. 我们对 ...

  3. 葵花宝典(转自:https://blog.csdn.net/binbin594738977/article/details/79429301 )

    android开发工具 http://www.androiddevtools.cn/index.html API开发文档(不需要fq) https://developer.android.google ...

  4. 开源项目综合案例https://blog.csdn.net/m0_37700275/article/details/78783049

    开源项目综合案例 置顶 2017年12月12日 16:16:17 杨充 阅读数:473 版权声明:本文为博主原创文章,转载请注明出处 https://blog.csdn.net/m0_37700275 ...

  5. 转载自https://blog.csdn.net/weixin_43793782/article/details/97308393

    小白为大家收集了11个web前端开发,大企业实战项目案例+5W行源码!拿走玩去吧! 老规矩:转发+关注并私信小编:"资料"全部打包带走! 下面给大家简单介绍几个: 小米官网: 项目 ...

  6. https://blog.csdn.net/blmoistawinde/article/details/84329103

    背景     很多场景需要考虑数据分布的相似度/距离:比如确定一个正态分布是否能够很好的描述一个群体的身高(正态分布生成的样本分布应当与实际的抽样分布接近),或者一个分类算法是否能够很好地区分样本的特 ...

  7. 数据采集之解析Mysql的binlog日志发送至Kafka实时消费(转:https://blog.csdn.net/liguohuabigdata/article/details/79472777)

    本文采用Maxwell来实现实时解析mysql的binlog日志发送至kafka 1.开启mysql binlog 环境中mysql是docker容器,所以需要进入容器修改mysql配置.docker ...

  8. https://blog.csdn.net/nameofcsdn/article/details/53164652

    https://blog.csdn.net/nameofcsdn/article/details/53164652 转载于:https://www.cnblogs.com/Yinku/p/106872 ...

  9. https://blog.csdn.net/cscscscsc/article/details/50

    https://blog.csdn.net/cscscscsc/article/details/50899522 转载于:https://blog.51cto.com/7237876/2129682

最新文章

  1. Python常用库使用笔记
  2. Duilib技巧:背景图片平铺
  3. oracle查看被锁的表和解锁
  4. 电脑底下的任务栏不见了_拿到一台新的Windows电脑,我会做什么?
  5. 修正本地乱码(待补充)
  6. dhcp是哪一层的协议_随手记(3)常见的网络协议有哪些
  7. php 波形图,PHP分析.wav文件并绘制png格式的波形图_PHP
  8. Python实现蒙特卡罗方法仿真模拟求解圆周率Pi值
  9. jrtplib for android,Jrtplib Android平台编译
  10. 软考每日一练||网络工程师
  11. CNN基础——如何设置BatchSize
  12. 有这5类人最难成为银行的优质客户!
  13. Deep Unordered Composition Rivals Syntactic Methods for Text Classification
  14. 国家标准GB7713-87
  15. MySQL面试问题包含答案仅参考
  16. bic计算机原理,CBTC系统区域控制器(ZC)功能及原理探究
  17. OpenCV-Python实战(22)——使用Keras和Flask在Web端部署图像识别应用
  18. Python3-豆瓣电影影片差评和影片封面照片的爬取
  19. Reasoning with Sarcasm by Reading In-between(MIARN 2018)论文笔记
  20. clamp.js用法初窥

热门文章

  1. 函数:fopen的使用方法
  2. 学计算机会学dos,DOS操作系统和上课学习的应用软件_CPUCPU评测-中关村在线
  3. 基于LVM的磁盘管理
  4. mysql replication /mysql 主从复制原理
  5. 《python编程从入门到实践》第2版 第四章课后练习
  6. vue实现盒子的拖拽移动
  7. 初入职常见问题:弱网络环境构造、压力测试、内存泄漏、性能持续优化工具
  8. html页面标尺,canvas实现标尺.html
  9. Android隐藏录屏内容,原来手机内置的录屏功能这么强大,好多人都不会用,很可惜!...
  10. 设置短域名跳转目标网址,长链接缩短的方法