Js基础，函数，对象，操作DOM元素

最新推荐文章于 2024-04-26 16:47:03 发布

Andy310564

最新推荐文章于 2024-04-26 16:47:03 发布

阅读量110

点赞数

文章标签： javascript 前端

本文链接：https://blog.csdn.net/Andy310/article/details/125487315

版权

JS书写位置：

JS有三种书写位置，分别为：

行内

内嵌

外部

JavaScript中的变量：

变量就是一个装东西的盒子，通俗的来说，变量就是存放数据的容器。我们通过变量名获取数据，甚至可以修改数据

JavaScript数据类型：

Number

数字型，包含整数值和浮点值

Boolean

布尔值类型，如true、false，等价与1和0

false

String

字符串类型

“”

Undefined

Var a;声明了变量a但是没有给值，此时a = undefined

undefined

Null

Var a = null；声明了变量a为空值

null

JavaScript分支语句：

分支结构

由上到下执行代码的过程中，根据不同的条件，执行不同的路径代码（执行代码多选一的过程），从而得到不同的结果

分支语句分类：

if…else

switch

JavaScript循环语句：

循环结构：

循环语句的作用是反复地执行同一段代码，只要给定的条件能得到满足，包括在循环条件语句里面的代码就会重复执行下去，一旦条件不再满足则终止。

循环语句分类：

for

while

do…while

JavaScript中的函数：

封装了一段可以被重复调用或者执行的代码块，通过这个代码块可以实现大量代码的重复使用，这就叫做函数。

创建函数1：

function getSum(){

return 1+2

}

function 函数名([参数列表]) {

//函数体代码

}

function 是声明函数的关键字,必须小写

由于函数一般是为了实现某个功能才定义的，所以通常我们将函数名命名为动词，比如 getSum

创建函数2：

var getSum = function（[a,b]）{

return a+b;

}

var 函数名 = function ([参数列表]) {

//函数体代码

}

因为函数没有名字，所以也被称为匿名函数

这个变量名里面存储的是一个函数

函数表达式方式原理跟声明变量方式是一致的

函数调用：

函数名（[参数列表]）

getSum()

getSum(a,b)

JavaScript中的对象的定义：

JavaScript 对象是拥有属性和方法的数据

属性：事物的特征

方法：事物的行为

创建对象的方法1：

var dog = {

uname:’可乐’,

age:2,

color:yellow,

eat:function(){alert(“吃狗粮”)}

}

使用字面量创建对象：

var star = {

属性1:属性值1,

属性2:属性值2,

属性3:属性值3

方法1:函数1；

}

创建对象的方法2：

var dog = new Object();

dog.uname = ’可乐’,

dog. age = 2,

dog. color = yellow,

dog.eat=function(){alert(“狗粮”)}

利用 new Object 创建对象：

var star = new Object();

star.属性1=“属性1”；

star.属性2=“属性2”；

star.属性3=“属性3”；

star.方法1=函数1

创建对象的方法3：

利用构造函数创建对象：

function 构造函数名([形参1,形参2,形参3]) {

this.属性名1 = 参数1;

this.属性名2 = 参数2;

this.属性名3 = 参数3;

this.方法名 = 函数体;

}

var obj=new 构造函数名（[实参1，实参2，实参3]）

访问对象的属性和方法：

1.访问属性：

对象.属性名

对象[“属性名”]

2.访问方法：

对象.方法名()

什么是DOM?

DOM （ Document Object Model ），叫做文档对象模型，DOM可以以一种独立于平台和语言的方式访问和修改html文档的内容和结构。

<html>

<head>

</head>

<body>

<h1>DOI的结构</h1>

<p>

</p>

</body>

</html>

DOM节点分类：

DOM （ Document Object Model ），叫做文档对象模型，DOM可以以一种独立于平台和语言的方式访问和修改html文档的内容和结构。

文档节点==>document元素节点==>标签属性节点==>标签的属性文本节点==>标签体

DOM的作用：

通过可编程的对象模型

JavaScript 能够创建动态的 HTML节点

JavaScript 能够改变页面中的所有 HTML 元素

JavaScript 能够改变页面中的所有 HTML 属性

JavaScript 能够改变页面中的所有 CSS 样式

JavaScript 能够对页面中的所有事件做出反应

DOM查询元素方法：

getElementById(“id值”)

通过 id 查找 HTML 元素

一个元素对象

getElementsByTagName（”name值”）

通过标签名查找 HTML 元素

元素对象集合

getElementsByClassName（”class值”）

通过类名找到 HTML 元素

元素对象集合

querySelector

通过选择器获取第一个对象

一个元素对象

querySelectorAll

根据选择器返回所有对象集合

元素对象集合

body

获取body元素

一个元素对象

documentElement

获取html元素

一个元素对象

DOM元素的其他方法：

createElement

用于创建一个元素节点

appendChild

向一个元素节点的末尾追加一个节点

insertBefore

向某一个节点前插入一个节点

removeChild

移除某一节点下的某一个节点

replaceChild

将页面中的某一个节点替换掉

Andy310564

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Js基础，函数，对象，操作DOM元素

JS书写位置：JS有三种书写位置，分别为：行内内嵌外部JavaScript中的变量：变量就是一个装东西的盒子，通俗的来说，变量就是存放数据的容器。我们通过变量名获取数据，甚至可以修改数据JavaScript数据类型：Number数字型，包含整数值和浮点值0Boolean布尔值类型，如true、false，等价与1和0falseString字符串类型“”UndefinedVar a;声明了变量a但是没有给值，此时a = undefined
复制链接

扫一扫