JavaScript学习笔记

一:

document.getElementById("id")   调用id

二:

innerHTML

获取或设置指定元素标签内的 html内容 或插入元素内容

三:

window.alert();

弹出警告框来显示数据

四:

document.write()

使用 document.write() 仅仅向文档输出写内容。 

如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。

五:

onclick=函数名+()

点击事件   调用函数

六:

innerHTML 和 document.write()

<p>这是一个段落</p>
<p id="demo">这也是一个段落</p>
<script>
document.getElementById("demo").innerHTML="段落已修改。";

</script>

这个仅仅只是替换了 id 为 demo里的内容，没有覆盖页面。

 运行结果

<p>这是个段落</p>
<button onclick="myFunction()">覆盖文档</button>
<script>
function myFunction()
{
document.write("糟糕，页面换掉了")
}
</script>

 点击按钮之后

七:

 图片源自菜鸟教程

八: 关键字var

关键字 var 来定义变量， 使用等号来为变量赋值

变量可以通过变量名访问。在指令式语言中，变量通常是可变的。字面量是一个恒定的值。 

变量是一个名称,字面量是一个值

九:JavaScript语言有多种类型的运算符

类型	实例	描述
赋值，算术和位运算符	=  +  -  *  /	在 JS 运算符中描述
条件，比较及逻辑运算符	==  != <  >	在 JS 比较运算符中描述

 局部变量建议使用let去定义

var相当于全局变量

substring 字符串截取

substring (1)   //从第一个字符串截取到最后一个字符串

substring (1,3) // [1,3)  左闭右开

数组

Array可以包含任意的数据类型

var arr=[1,2,3,4,5,6]  //通过下标取值和赋值
arr[0]
arr[0]=3

 长度

arr.length  

假如给arr.length赋值,数组大小就会发生变化,如果赋值过小,元素就会丢失

ver arr=[1,2,3,4,5,6]
arr.length=2
arr=[1,2]

indexOf,通过元素获得下标索引

indexOf(元素)    >>返回下标索引

 元素不存在，indexOf会返回-1

slice ()截取Array的一部分，返回一个新数组，类似于String中的substring

 push()   pop()

 push:压入尾部

pop:弹出尾部的一个元素

unshift()   shift()

 unshift() : 压入到头部

shift():弹出头部的一个元素

sort()  排序

默认正序

 reverse元素反转

 concat(数组) 拼接数组 并返回一个新的数组

注:并没有修改数组

连接符join

打印拼接数组，使用特定的字符串连接

 多维数组

 对象

若干个键值对

var 对象名= {
属性名:属性值,
属性名:属性值,
属性名:属性值,
属性名:属性值
}
var person={
name:xi
age:4
score:60
email:123@qq.com
}

JavaScript中的所有的键都是字符串，值是任意对象!

1.Js中对象，{.....}表示一个对象，键值对描述属性xxxx: xxxx，多个属性之间使用逗号隔开，最后一个属性不加逗号!

2.使用一个不存在的对象属性，不会报错! undefined

3.动态的删减属性，通过delete删除对象的属性

delete person. name
true

4、动态的添加，直接给新的属性添加值即可

person  haha = "haha"
"haha"

5、判断属性值是否在这个对象中!   xxx in xxx!

'age' in person
true
//继承  可以找到他父类的方法
'tostring' in person
true

6、判断一个属性是否是这个对象自身拥有的hasOwnProperty()

person . hasOwnProperty('tostring')
fa1se
person . hasownProperty('age ')
true

流程控制

if 判断

 var age = 3;
  if (age>3){
      alert("haha");
    }else {
    alert("ku");
}