js
流程控制语句
顺序结构 从上往下依次执行
选择结构(分支结构) if(单分支)
if(条件){
如果条件成立 执行这里的代码
}
//单分支的简写写法 可以省略花括号 if(条件)执行语句(只能跟一行代码)
if(条件){
条件成立执行if中的代码
}else{
条件不成立执行else中的代码
}
if(条件1){
条件1成立执行的代码
}else if(条件2){
条件2成立执行的代码
}
.......
else{//以上条件都不成立的时候执行的代码
}
循环结构
for(var i = 0;i<=10;i++){
}
双重for循环
for(var i = 0;i<=10;i++){ // i = 0 1
for(var j = 0;j<3;j++){// j = 0 1 2
}
}
json数据/对象/object:是一组无序的没有长度的数据
```
## 2.自定义索引
```js
<body>
<ul>
<li>这是第1个li标签</li>
<li>这是第2个li标签</li>
<li>这是第3个li标签</li>
<li>这是第4个li标签</li>
<li>这是第5个li标签</li>
<li>这是第6个li标签</li>
<li>这是第7个li标签</li>
<li>这是第8个li标签</li>
<li>这是第9个li标签</li>
<li>这是第10个li标签</li>
</ul>
<script>
/*
把下标存在自定义属性index中
*/
var oLi = document.getElementsByTagName("li");
// // 添加自定义属性
// oLi[0].index = 0;
// oLi[1].index = 1;
// oLi[2].index = 2;
// oLi[3].index = 3;
// oLi[4].index = 4;
// oLi[5].index = 5;
// oLi[6].index = 6;
// oLi[7].index = 7;
// oLi[8].index = 7;
// oLi[9].index = 9;
// for (var i = 0; i < oLi.length; i++) {
// oLi[i].index = i;
// }
for (var i = 0; i < oLi.length; i++) {
oLi[i].index = i;//自定义索引 就是自定义属性的一种
oLi[i].onclick = function () {
console.log(this.index)
}
}
</script>
</body>
```
## 3.函数
### 3.1基础概念
- 函数funtion:函数就是将具有独立功能的代码块 整合在一起并命名,什么时候需要什么时候调用
- 作用:可以提高代码的重复率
```js
rightBtn.onclick = function(){ change() }
leftBtn.onclick = function() { chagne() }
dots.onclick = function() { change() }
//切换图片功能
function change(){
切换图片
}
```
- 使用场景
- 1.作为事件处理函数使用
```js
1.作为事件处理函数使用
button.onclick = function(){
}
```
- 2.==代码复用函数封装==
```js
rightBtn.onclick = function(){ change() }
leftBtn.onclick = function() { chagne() }
dots.onclick = function() { change() }
//切换图片功能
function change(){
切换图片
}
```
- 3.对象中的方法
```js
var obj = {
"name":"Zs",
"skill":function(){
//对象中的函数不叫函数 叫方法
}
}
//使用 obj.skill()
```
### 3.2函数声明及使用
- 普通声明
```js
声明:funtion 函数名(){ 代码块 }
使用:函数名()
```
```js
//1.普通声明
function home() {
//代码块
console.log("做作业");
console.log("打游戏");
console.log("睡觉");
console.log("看美女");
console.log("吃法");
}
function home() {
console.log(1);
}
// 使用 函数名()
home();
home();
home();
```
- 表达式声明
```js
声明:var 变量名 = function(){ 代码块 }
使用:变量名()
```
```js
// 2.表达式声明 var 变量名 = function(){ 代码块 }
var home1 = function () {
console.log("中午吃饭睡午觉");
}
// 使用 变量名()
home1();
home1();
home1();
home1();