2021-3-3 JS语法、BOM、DOM回顾

JavaScript 字符串

字符串可以存储一系列字符,如 "John Doe"。

字符串可以是插入到引号中的任何字符。

字符串的索引从 0 开始,这意味着第一个字符索引值为 [0],第二个为 [1], 以此类推。


用于字符串的 + 运算符

+ 运算符用于把文本值或字符串变量加起来(连接起来)。

如需把两个或多个字符串变量连接起来,请使用 + 运算符。



条件语句

通常在写代码时,您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。

在 JavaScript 中,我们可使用以下条件语句:

·if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码

·if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码

·if...else if....else 语句- 使用该语句来选择多个代码块之一来执行

·switch 语句 - 使用该语句来选择多个代码块之一来执行


if 语句

只有当指定条件为 true 时,该语句才会执行代码。

if...else 语句

请使用 if....else 语句在条件为 true 时执行代码,在条件为 false 时执行其他代码。

if...else if...else 语句

使用 if....else if...else 语句来选择多个代码块之一来执行。

语法

if (condition1)

{

    当条件 1 为 true 时执行的代码

}

else if (condition2)

{

    当条件 2 为 true 时执行的代码

}

else

{

  当条件 1 和 条件 2 都不为 true 时执行的代码

}

switch 语句

请使用 switch 语句来选择要执行的多个代码块之一。

switch(n) { case 1:

执行代码块 1

break;

case 2:

执行代码块 2

break;

default:

与 case 1 和 case 2 不同时执行的代码

}



不同类型的循环

JavaScript 支持不同类型的循环:

·for - 循环代码块一定的次数

·for/in - 循环遍历对象的属性

·while - 当指定的条件为 true 时循环指定的代码块

·do/while - 同样当指定的条件为 true 时循环指定的代码块


for (语句 1; 语句 2; 语句 3)

{

    被执行的代码块

}


var person={fname:"Bill",lname:"Gates",age:56};

for (x in person) // x 为属性名 {

txt=txt + person[x];

}


while (i<5) {

x=x + "The number is " + i + "<br>";

i++;

}

do {

x=x + "The number is " + i + "<br>";

i++;

} while (i<5);


DOM 文档对象模型 用JS表示的标签

可以跟页面交互?

1.可以在JS中获得到标签

2.知道有哪些交互(事件)

3.逻辑


JS操作HTML

1.创建HTML

document.createElement("标签名")

如:var p =document.createElement("p")

属 性 :在JS获取或设置属性

<img.src="1.jpg">

2.获取HTML 用JS修改样式、内容、添加事件

3.删除HTML

4.替换HTML

/innerHTML 往标签里放字符串格式标签

//innertext 往标签里面放文本内容 不能放字符串格式标签


//清空标签

/.innerHTML="";

// document.body.innerHTML=""


JSON对象 一种数据格式 没有语言限制 格式:{“key键”:值,“key键”:[ 1,2,3 ] }

{

"username": "xiaoming",

"age": 99,

"friends": ["xiaohua","xiaolv","小猪"]

}

XML 数据格式 没有语言限制 类似于html格式


//复制元素 cloneNode()

如://复制dom元素

if (left%50===0||top%50===0){

var p = person.cloneNode();

document.body.append(p);

p.style.opacity = Math.random();

}

}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容