学习记录013-HTML基础js操作

Posted 2020-11-12 郭等等

概念

html中的三把利器的JS 又称为javascript，看着好像和Java有点联系，实际是没有任何关系的，JavaScript和Python、Go、Java、C++等，都是一种独立的语言，Python的解释器有Python2.7、Python3.x，浏览器具有解释JavaScript的功能，所以它才是HTML的三把利器之一。

在HTML中可以将JavaScript/JS的代码写在head中，被script标签所包裹，当浏览器解释HTML时，遇到style标签时，按照CSS规则解释，遇到Script标签时，按照JavaScript的语法规则解释。

引入JavaScript代码，类似于Python的import

<script src="public.js" type="text/javascript"></script>

head中引入JS与body中引入JS区别

html代码从上而下解析，如果在head中引入JS，影响页面打开的速度，存在风险，所以通常放在htmlbody的最下方，这样页面内容先展示，最后在加载JS。注：写在最下面要有底线，写在body内部的最底下。

注释

单行注释通过 //  多行通过 /* */

js定义变量

name = ‘gdd‘   默认全局变量
const name = ‘nhy‘   在es6里面，使用const定义的变量为常量，不可进行更改

Js基本上数据类型（Js中声明数据类型通过new）

字符串

var str = "你开心就好"   定义一个字符串

字符串拼接的两种方式
001 
var str = "你开心就好"
var str = str + ",我开心更好"
002
var str = "你开心就好"
strr = str.concat("，我开心更好")

str.charAt(1)   获取字符串对应角标的内容是什么
str.substr(0,2)    切片获取字符串的元素；和python一样顾头不顾尾
str.slice(0,2)      同上
str.length    获取当前字符串的长度
str.indexOf("和")    获取字符串里面元素的角标；常用于判断，如果在即返回，否则返回-1
str.toLowerCase()    字符串为小写
str.toUpperCase()    字符串均为大写
str.split(",")   拿逗号进行分割字符串的内容，返回的是一个list
str.split(",",2)  返回字符串的以逗号分隔的前两个，返回的也是一个list

数字类型（JavaScript 只有一种数字类型。数字可以带小数点，也可以不带）
字符串转化成数字
var num = "18.8"
parseInt(num)      转化成整数，输出为18，小数点后面的舍弃
parseFloat(num)     输出依然为18.8，只是将字符串转化成数字类型

数字转化成字符串

num = 18   num.toString()

布尔类型（true 或 false）
var t = true; var f = false;

 

数组类型（就是python的列表）

创建列表的方式：三种
第一种
var list = new Array()
list[0]= "西红柿"
list[1]="黄瓜"
第二种
var list2 = new Array("黄瓜","西红柿")
第三种
var list1 = ["西红柿","香蕉"]

数组操作
list.length    查看长度
list.push("火龙果")        给列表的最后添加元素
list.shift()    拿出列表的第一个元素，并且把这个元素进行删除
list.unshift("西红柿")    找到列表的头，进行元素的添加
list.pop()   拿出尾部的元素进行删除

list.splice(start, deleteCount, value) 操作的位置角标、操作元素的个数，删除或添加元素
list = ["a","b","c"]
list.splice(n,0,val)    指定位置插入元素 
list.splice(n,1,val)    指定位置替换元素 
list.splice(n,1)           指定位置删除元素 
list.slice(0,2)    列表操作切片：顾头不顾尾
list.reverse()    列表反转
list.join("-")      根据制定字符进行列表元素的拼接

两个列表的拼接
list1 = ["d","e"]
list = ["a", "b", "c"]
list.concat(list1)
输出为一个list

list.sort()    列表排序

 

对象类型（等同于python的字典）

定义对象
var dict = {"name":"guodengdeng","age":18}
dict.name   获取key的value值
dict["name"]    获取key的value值
dict.name = "hujiangchuan"    修改key的值