04 JavaScript-BOM

04-BOM

1内置对象

Window对象 Browser（浏览器）0M

window是bom的顶级对象。通常情况下，可以省略弹出框alert(2);

•输入框prompt();

带确定取消的输入框confirm();

成员变量（全局）也是window的一个属性而已

alert(window.aaa);

alert(aaa === window.aaa);

自定义函数也是Window的一个方法

console.log(window.fn);

新窗口 = window.open（地址,target属性或

窗口名称，新窗口的参数，属性名：属性值....)；

3window.open("http://www.baidu.com"," blank")；

4location.href ="http://www.baidu.com";打开新窗口（页签）

5window.close();关闭本页面

新窗 口.moveTo(500, 500);

回退

history.go(-1);

history.back();

setlnterval（执行谁，多长时间执行一次）

循环定时器；周而复始的执行（循环执行）

setTimeout（执行谁，多长时间执行一次）

炸弹定时器；用完以后立刻报废（只执行一次）

clearlnterval(timer)；停止定时器练习:

5秒关闭广告

关闭广告栏（逐渐消失）

1.1 Date

创建时间对象

new Date()；

new Date("2016/09/06 00:00:00")；

new Date(2016，1，27)；

new Date('Wed Jan 27 2016 12:00:00GMT+0800:（中国标准时间）’）；

后两种兼容性不好，不推荐使用

date.getDate()   获取日1-31

date.getDay ()    获取星期（0-6）

(0代表周日）

date.getMonth     获取月（0-11）

(1月从0开始）

date.getFullYear     获取完整年

份（浏览器都支持）

date.getHours     获取小时

date.getMinutes    获取分钟

0-59

date.getSeconds 获取秒

0-59

date.getMilliseconds   获取毫秒

(1s = 1000ms )

date.getTime (      返回累计毫

秒数(从1970/1/1 8：00)

获取当前时间距离1970/01/01的毫秒值的方式

Date.now()；

+new Date()；

new Date().getTime()；

new Date().valueOf()；

案例：模拟日历、倒计时

1.2 String

1.2.1 给索引查字特(charAt/charCodeAt)

1.charAt，获取相应位置字待（参数：字符位置）a.注释：字符串中第一个字符的下标是0。

b. 如果参数index不在0与 string.length 之间，该方法将返回一个空字符串。

2. charCodeAt获取相应位置字符编码（参数：字符位置）

3. charAt()方法和charCodeAt)方法用于选取字待串中某

一位置上的单个字符

4. 区别：

a.

charCodeAt()方法，它并不返回指定位置上的字符本身，而是返回该字特在Unicode字符集中的编码值。

b.如果该位置没有字符，返回值为NaN.

5.字符/字符编码= Str.charAt/charCodeAt（索引值）；

1.2.2 给字符查素引

( indexOflastlndexOf )

1. indexOf,从前向后索引字符串位置（参数：索引字符串）从前面寻找第一个符合元素的位置

2.lastIndexOf,从后向前索引字待串位置（参数：索引字符串）

a.从后面寻找第一个特合元素的位置

3.找不到则返回-1

4.索引值=str.indexOf/lastlndexOf（想要查询的字待）；

1.2.3 url编码和解码（了解）

URI(Uniform Resource ldentifiers, 通用资源标识特）进行编码，以便发送给浏览器。

有效的UR中不能包含某些字符，例如空格。

而这URI编码方法就可以对UR进行编码，它们用特殊的UTF-8编码替换所有无效的字待，从而让浏览器能够接受和理解。

encodeURIComponent(url)函数可把字符串作为URILl

组件进行编码

decodeURIComponent(encode) 函数可把字特串作为

URI组件进行解码

1.2.4 字符串的链接

新字符串=strl.concat(str2)；链接两个字待串

1.2.5 字符串的截取

1.slice

a. 截取字符串（参数：1，截取位置【必须】，2终结点）

b. 字符串=str.slice（索引1，索引2)；两个参数都是索引值。

i. (2,5) 正常包左不包右。

ii.(2) 从指定的索引位置剪到最后。

iii.(-3)从倒数第几个剪到最后

iv.(5, 2)前面的大，后面的小，空。

2. substr，截取字符串（参数：1，截取位置【必须】，2截取长度）

a. 字特串=str.substr（参数1，参数2)；1索引值,2长度。

b. 第一个参数为从索引位置取值，第二个参数返回字符长度。

i.(2, 4)1 从索引值为2的字符开始，截取4个字符。

ii.(1) 一个值，从指定位置到最后。

iii.(-3)从倒数第几个剪到最后.

iv.不包括前大后小的情况。

3. substring 同slice

a. 字符串=str.substring（参数1，参数2);两个参数都是索引值。

b. 不同1：参数智能调转位置。

C.不同2：参数负值，将全部获取字符串。i.(2,5)正常包左不包右。

ii.(2) 从指定的索引位置剪到最后。

iii.(-3) 获取全部字符串.

iv.(5, 2)前面的大，后面的小，不是空。

(倒着找）

1.2.6 特殊方法简介

1. trim() 1/只能去除字符串前后的空自

2. replace()//替换

a. str.replace(/aaa/qi, “ bbb”);

b. g全局替换

C.i保证大小写一致，一起被识别替换

3. split(“l”)//字符串变数组

4. tolowerCase()、toUpperCase()，转换大小

案例：

1.截取字特串“我爱你中国，我亲爱的中国的母来”，中的“中国，我亲爱的”；

2.

"abcoefoxyozzopp“查找字符串中所有出现的位置

1.3 Math

Math.abs(); 取绝对值

Math.floor(); 向下取整

Math.ceil(); 向上取整

Math.round(); 四舍五入取整

Math.random()；随机数0-1

2offset家族

2.1 三大字族和一个事件对象

三大家族(offset/scroll/client), 其实就是DOM的

一些属性

事件对象/event （事件被触动时，鼠标和键盘的

状态）（通过属性控制）

2.2 Offset家族简介

offset这个单词本身是-偏移，补偿，位移的意思。

js中有一套方便的获取元素尺寸的办法就是offset家族；offsetWidth和offsetHight以及offsetleft和offsetTop以及offsetParent共同组成了offset家族。

2.2.1 offsetWidth和offsetHeight

这两个属性，他们绑定在了所有的节点元素上。获取之后，只要调用这两个属性，我们就能够获取元素节点的宽和高。

offsetWidth =width+padding+border;

offsetHeight =Height+padding+border;

2.2.2 offsetleft和offsetTop (

1.返回距离上级盒子（带有定位）左边上边的位

2.如果父级都没有定位则以body为准

3.从父亲的padding开始算，父亲的border不算。

y.在父盒子有定位的情况下,offsetleft ==

style.left（去掉px并在行内赋值）

2.2.3 offsetParent （检测父系盒子中带有定位的父盒子节点）

1.返回该对象的父级（带有定位）

a.如果当前元素的父级元素没有进行CSS定位offsetParent为body。

2.如果当前元素的父级元素中有CSS定位

a. offsetParent取最近的那个父级元素。

2.3 offsetleft和stule.left区别

1.最大区别在于offsetleft可以返回没有定位盒子的距离左侧的位置。如果父系盒子中都没有定位，以body为准。

2. offsetTop 返回的是数字，而style.top 返回的是字符串，除了数字外还带有单位：px。

3. offsetTop只读，而style.top可读写。（只读是获取值，可写是赋值）

4.如果没有给HTML元素指定过top 样式，则style.top返回的是空字特串。style.left只能获取行内式，如果没有返回“〃

3动画和封装

3.1 动画定义

运动的图片。（让图片或者图画动起来）

3.2 动画的种类

闪现

匀速

动画原理：盒子未来的位置=盒子现在的位置+固定步长；

缓动

O 动画原理：盒子未来的位置=盒子现在的位置+动态步长；

练习：动画封装

BUG1：点击多次以后，越来越快。

BUG2:无法返回。原因就是步长不能为恒定值。

BUG3:二次点击不停止问题。

4案例

焦点图

切换图

无缝滚动

5缓动动画

5.1 三个函数

都是在数轴上向上或者向下取整。

Math.ceil()       1/向上取整

Math.floor()          1/向下取整

Math.round()；     1/四舍五入

5.2 缓动动画原理

leader=leader+(target-leader)/10

盒子位置=盒子本身位置+（目标位置-盒子本身位置）/ 10；

动画原理=盒子位置+步长（步长越来越小）。

5.3 体验缓动动画

var btn =document.getElementsByTageName("button")[0];

var box =document.getElementsByTageName("div")[0];

btn.onclick = function(){

setInterval(function()(

1/3.动画原理（盒子的位置 = 盒子本身的位置+步长）

盒子位置 = 盒子本身位置 +(目标位置 -盒子本身位置）/ 10;

//leader = leader +(target-leadeer) / 10；

box.style.left =box.offsetLeft + (400-box.offsetLeft) / 10+‘px’}，30px"

5.4 分析为什么没有到达指定位置

JS实际运算时会四舍五入取整，然后计算。

5.5 筋斗云

鼠标悬停和鼠标移开不会影响初始化值，只有点击

影响。而移开的情况下，span移动到计数器的位置。

6第二家族scroll

6.1 Scroll安族组成

6.1.1 ScrollWidth和scrollHeight（不包括border )

检测盒子的宽高。（调用者：节点元素。）

盒子内容的宽高。（如果有内容超出了，显示内容的高度）

IE8以下，不包括E8，为盒子本身内容的多少。

6.1.2 scrollTop和scrollleft

网页，被浏览器遮档的头部和左边部分

兼容有问题（火狐和谷歌就不一样）

window.onscroll只能使用一次，多了一最后一次为准

6.1.3 它有兼容性问题（火狐演示）

OTO:兼容老版本浏览器，使老版本浏览器可以遵循一些新的标准

1.未声明OTO(谷歌只认识body, ie9+以上认识它）a. document.body.scrollTop;

2.已经声明DTD (IE678只认识documentElement, ie9+以上任何时候）

a. document.documentElement.scrollTop;

3. 火狐/谷歌/ie9+以上支持的（不管有没有DTO)

a. window.pageXOffset window.pageYOffset

4. ie9+以上：

a. IE9+推翻了之前的设计理念，创造斯巴达 edge

是否声明DTD:document.compatMode

o 返回“BackCompat”未声明O 返回”CSSCompat ”已声明。

6.1.4 兼容写法

var y = window.pageYoffset ll

document.documentElement.scrollTop

document.body.scrollTop|I 0；I

6.2 获取title、body、head、html标签document.title--- 文档标题；

document.head--- 文档的头标签

document.body--- 文档的body标签；

document.documentElement ---这个很重要

document.documentElement它表示文档的html标签，也就是说，基本结构当中的html标签并不是通过document.html去访问的而是document.documentElement。

6.3 Scrollo的封装

6.3.1判断页面有没有DTD

document.compatMode === "BackCompat" 注意大小写

BackCompat 未声明

CSS1Compat 已经声明

只要判断不是undefined就可以调用pageVOffset

只要判断是CSS1Compat就可以调用documentElement

只要判断是BackCompat就可以调用body

Return{

"top": window.pageYoffset lI

document.documentElement.scrollTop

Il document.body.scrollTop

"left": window.pagexoffset |I

document.documentElement.scrollLeft

document.body.scrollLeft

7小知识

7.1 onscroll事件

只要页面滚动无论向左向右，向上向下，哪怕只有

1px，都会触动这个事件

7.2 屏幕跳转

window.scrollTo

方法可把内容滚动到指定的坐标。格式：

scrollTo(xpos, ypos)

xpos 必需。要在窗口文档显示区左上角显示的文档的x 坐标。

ypos 必需。要在窗口文档显示区左上角显示的文档的y

坐标

8事件对象(event )

在触发DOM上的某个事件时，会产生一个事件对象

event,这个对象中包含着所有与事件有关的信息。所有浏览器都支持event对象，但支持的方式不同。

比如鼠标操作时候，会添加鼠标位置的相关信息到事件对象中。（类似Date)

普通浏览器支持event（带参，任意参数）

ie678 支持window.event（无参，内置）

总结：他是一个事件中的内置对象。内部装了很多关于鼠标和事件本身的信息。

8.2 事件对象的获取(event的获取）

1E678中 , window.event

在火狐谷歌中，event或者，在事件绑定的函数中，加参，这个参数就是event.

box.onclick = function (aaa)(

1/aaa就是event

8.3 兼容获取方式有两种：不写参数直接使用event;写参数，但是为event....

var event = event ll window.event; （主要用这种）

8.4 event内容重要内容

属性

timeStamp

bubbles

button

pageX

pagey

screenX

screenY

返回事件生成的日期和时间。

返回布尔值，指示事件是否是起泡事件类型。

返回当事件被触发时，哪个鼠标按钮被点击。

光标相对于该网页的水平位置(ie无)光标相对于该网页的垂直位置(ie无）光标相对于该屏幕的水平位置

光标相对于该屏幕的垂直位置

8.5 screenx、pagex和clientX的区别

pageY/pageX:鼠标位于整个网页页面的顶部和左侧部分的距离。（页面）

screenY/screenX:鼠标位于屏幕的上方和左侧的距离。（屏幕）

clientX/clienty:鼠标位于浏览器的左侧和顶部的距离。（浏览器大小和位置）

8.6 pageV和pageX的兼容写法（低版本不支持,很重要）

在页面位置就等于=看得见的+看不见的

pageY/pagex-event.clientY/clientx+scroll().top/scroll().left

8.7 新事件(onmousemove)

只要鼠标在绑定该事件的事件源上移动，哪怕1像素，也会触动这个事件。

（这个事件可以直接或者间接的替代定时器）

点击鼠标跟随

鼠标在盒子中的位置

8.8 案例放大镜

9第三大安族client

9.1 主要成员

1、clientWidth 获取网页可视区域宽度（两种用法）

clientHeight 获取网页可视区域高度（两种用法）

调用者不同，意义不同：

盒子调用： 指盒子本身。

body/html调用： 可视区域大小。

2、clientX 鼠标距离可视区域左侧距离(event调用）

clienty 鼠标距离可视区域上侧距离( event调用）

3、clientTop/clientleft 盒子的border宽高

9.2 三大安族区别（三大家族总结）

9.2.1 Width和height

clientWidth= width + padding

clientHeight = height + padding

offsetWidth = width + padding +border

offsetHeight = height + padding +border

scrollWidth =.内容宽度（不包含border)

scrollHeight= 内容高度（不包含border)

9.2.2 top和left

offsetTop/offsetleft :

调用者：任意元素。（盒子为主）

作用：距离父系盒子中带有定位的距离。

scrollTop/scrollleft:（盒子也可以调用，必须有滚动条）

调用者：document.body.scrollTop /....(window)

作用：浏览器无法显示的部分（被卷去的部分）。

clientV/clientX:( clientTop/clientleft值的是border)

调用者：event.clientX(event)

作用：鼠标距离浏览器可视区域的距离（左、上）。

9.3 client家族特殊用法之：检测览器宽/高度（可视区域）

function client()

if (window. innerwidth!=

undefined)f

return[

width:window.innerwidth,

height: window.innerHeight

Jelse

if(document.compatMode=== CSS1Compat")[

returnf

width:document.documentElement.cli

entWidth

height:document .documentElement.cl

ientHeight

returnf

width:document.body.clientWidth,

height:document.body.clientHeight

9.4

onresize事件

只要浏览器的大小改变，哪怕1像素，都会触动这个事件。

9.5 案例：根据测览器可视区域大小，给定背景色

500red 700 yellow 800blue 1000black

9.6

事件总结

区分：

1. window.onscroll 屏幕滑动

2. window.onresize 浏览器大小变化

3. window.onload

页面加载完毕

4. div.onmousemove 鼠标在盒子上移动（注

意：不是盒子移动!!!)5. onmouseup/onmousedown == onclick

9.7 获得屏苇宽高

window.screen.width

分辨率是屏幕图像的精密度，指显示器所能显示的像素有多少。

我们的电脑一般：

横向1920个像素点，纵向1080个像素点。

10冒泡

事件：当一个元素上的事件被触发的时候，比如说鼠标点击了一个按钮，同样的事件将会在那个元素的所有祖先元素中被触发。这一过程被称为事件冒泡；这个事件从原始元素开始一直冒泡到DOM树的最上层。(BUG)（本来应该一人做事一人当，结果，我做错了事情，你去告诉我妈）

什么是冒泡：子元素事件被触动，父盒子的同样的事件

也会被触动。

取消冒泡就是取消这种机制。

10.1 阻止冒泡

w3c的方法是：（火狐、谷歌、IE11)

event.stopPropagation()

IE10以下则是使用：event.cancelBubble = true

兼容代码如下：

var event = event ll window.event;

if(event && event.stopPropagation)

event.stopPropagation()；

elset

event.cancelBubble = true

10.2 addEventlistener（多数1，参数2，参数3)

调用者是：事件源。参数1：事件去掉on 参数2

：调用的函数

参数3：可有可无。没有默认false.false情况下，支持冒

泡。true支持捕获。

document.addEventListener("click", f

n, false);//false支持冒泡,true支持捕获

function fn(){

alert(1)；

冒泡顺序

IE 6.0:

div -> body -> html -> document 其他浏览器：

div -> body -> html -> document -> window

不是所有的事件都能冒泡。以下事件不冒泡：blur、focus、load、unload、onmouseenter onmouseleave

1/兼容获取事件触动时，被传递过来的对象

1/var aaa = event.target ll event.srcElement;

var aaa = event.target?

event.target:event.srcElement;

12缓动框架

12.1封装框架遇到的两个问题

原有的方法：div.stule.width:这个方法比较固定，不能用变量或者字待串的形式更换属性，不方便我传值获取属性，和给属性赋值。

属性值的获取和属性的赋值

div.style["width"] = "5000px";

可以通过传字符串或者变量的方式获取和赋值属性。缺点：他的操作完全是对行内式CSS来操作的。赋值的时候毫无问题。但是，获取值的时候有问题了。

12.2 获取任意类型的CSS样式的属性

div.stvle.width

div.currentStyle.width //(ie6、7、8 )

window.getComputedStyle(div, null).w idth;他们的公共使用变量或者字符串获取属性值的方法都是：去掉属性和点，然后加上中括号和属性的字符串形式。

div.style["width”];

div.currentStyle["width"]

window.getComputedStyle(div, null)[“width"]；

12.3 开闭原则

定义一个变量。数据可以修改。但是，只能修改成为两个值。

/开闭原则（更小范围内的计算器）（如果不说

话，我可清除定时器了啊）

1/位置问题，每进入一次定时器，都要初

始化一次flag（控制定时器的参数）

var flag = true;

不会的举手!（没到达目标位置的

说话，告诉程序不允许清除定时器）

if(leader != ison[k])f

flag = false;

1/所有属性都到达了目标位置，才清除定

if(flag)[

clearInterval(obi.timer);

fn()

}

12.4 回调函数

程序执行完毕，在次执行的函数。

在函数中给指定的函数定义一个形参，然后程序执行到最后，调用这个形参后面加一个括号。

11缓动框架（单个属性）

function aninate(obj, json, n)(clearInterval(obj.timer);

obj.timer = setInterval(function()f

11开闭原则（更小范围内的计数器）

（如果

11位置问题，没进入一次定时器，都要

var flag = true;

11进入定时器后，处理json中的每二个属性

for(var k in json)f

11所有属性都到到了目标位置

if(flag)f

clearInterval(obi.ti

除定时器以后，在执fn()；

13正则表达式(RegExp )

13.1 概述

正则表达式（英语：Reqular Expression )

本质：用来记录文本规则的代码

（为字符串定义规则，为输入内容定义规则!）

应用非常广泛，如：表单验证、高级搜索、生化科学

13.2 正则表达式的特点是：

灵活性、逻辑性和功能性非常的强；

可以迅速地用极简单的方式达到字符串的复杂控制。对于刚接触的人来说，比较晦涩难懂。

比加：

匹配国内电话号码：

\d(33-\d(8)1\d(4)-\d(7)

验证手机号

1^((13[0-9])1(15[^4, \D])1(18[0, 5-9]))\d(83$/

很难记住。

13.3 正则表达式声明

13.3.1 1.通过构造函数定义

var 变量名= new RegExp(/表达式/)；

13.3.2 2.通过直接量定义（较为常用）

var 变量名=/表达式/；

console.log(regexp1.test(345))；

console.log(/\d/.test(567))；（直接

使用）

13.3.3 正则表达式的组成是：（总结）

有一些普通字符和元字符组成，普通字符就是字母和数

字，元字符具有特殊意义的字特匹配腾讯QQ号：1-94,;

评注：腾讯QQ号从10000开始

比如\d

预定义类：表示数字 [0-9]

13.4 test()方法

正则对象方法，检测测试字符串是否符合该规则，返回

true和false，参数（测试字符串）使用语法：

Boolean = 表达式.test(“要验证的内容"）；

console.log(/\d/.test(567))；

验证 567 符不特合 ·\d 的规范

13.5 正则内部类（帮我们写好的工具直接使用）

13.5.1

预定义类

A\n\r] 除了换行和回车之外的任意

字符(“"不行）

\d [0-9] 数字字待

\D [A0-9] 非数字字符

\s [ \t\n\xOB\f\r]

\S

空白字待

TA \tinlxOB\f\r1 非空白字待

\w

\W

[a-ZA-Z_0-9]

[Aa-ZA-Z_0-9]

单词字符

非单词字待

13.5.2

简单类（正则：1/中什么特殊特号

都不写，和]的加入）

/string/.test("string")；

必须是完整的，只多不能少

/andy/.test(“andy")

// true

/andy/.test(“andylv")

// true

/andy/.test(“an")

// false

1/-句话，只要完整包含了andy 就可以了（有

他就行）

分

2、/[string]/.test("string")； 只要

包含里面的任何一个就可以

/[andy]/.test("andy")；

1/ true

8 /[andy]/.test("an")；

1/ true

9.e/[andy]/.test("ady");

1/ true

10 /[andy]/.test("anll")；

// true

11 /[andy]/.test("assd")；

// true

12 /[andy]/.test("ss")；

// false

13 /[3aH8]/.test("ss");

// false

13.5.3 负向类（不能是其中的整体或者一部分）

中括号内，前面加个元字符“进行取反，不是括号里面的字符(一部分也不行）。

（可以不够，但是不能多）（不够和正好，返回false；多了或者没有返回true )

console.log(/[Aabc]/.test('a'))；

console.log(/[Aabc]/.test('gg'))；

注意：这个符号^一定是写到方括号里面

13.5.4

范国类

有时匹配的东西过多，而且类型又相同，全部输入太麻

烦，我们可以在中间加了个横线

console.log(/[a-z]/.test('1111'))；

console.log(/[A-Z]/.test('aa'))；

13.5.5组合类

用中括号匹配不同类型的单个字待。

console.log(/[a-m1-5]/.test("b"))//true

13.6 正则边界（重点）^会匹配行或者字符串的起始位置注：^在门中才表示非!这里表示开始8会匹配行或字符串的结尾位置

S在一起表示必须是这个（精确匹配）

1

1/ 边界可以精确说明要什么

2

console.log(/lily/.test("lilyname")

)；// true

还3 console.log(/^lily$/.test("lily"));

// true

4

console.log(/Alily$/.test("ly"))；

console.log(/^andy$/.test("andy"))；// true

这个的最终意思就是说，必须是andy 这四个字母

137量词（重点）

（多个字母，重复最后一个）

*（贪梦）重复零次或更多 (>=0)

+（懒情）重复一次或更多次(>=1)

?（占有）重复零次或一次(l1)要么有要么没有

B 重复多少次的意思可以有多少个

您的银行卡密码只能是6位 16;

fns n次 (x=n)

in,  重复n次或更多(x>=n)

fn, m)重复出现的次数比n多但比m少(n<=x<=m)*+ (1)

? (0, 1)

xly 一个1x或者y（没有&，用的是，代替的）

()提高权限，有限计算

13.8

案例：

匹配座机号

var regexp =1(AO\df21-\df83$)

(AO\df31-\d:7$)/;

var demo = /A0\df21-

\d183$|A0\df33-\df73$/;

4

匹配中文

( /A[\u4e00-\u9fa5](2, 43$/)

3.匹配验证表单（注册QQ)

13.9 replace 函数

replacel)方法用于在字符串中用一些字符替换另一些字

符，或替换一个与正则表达式匹配的子串。吃

语法格式：（返回值是新字符串）

需要匹配的对象.replace（正则式/字符串，替换的目标字

特）

正则表达式的匹配模式支持的2个标志

g:表示全局模式(global)，即模式将被应用于所有

字符串而非发现一个而停止

i:表示不区分大小写(ease-insensitive) 模式，在确

定匹配想时忽略模式与字符串的大小写

script>

11 global 全局

g 全局模式，全部替换

var txt = "today is a fine day!"；

console.log(txt.replace(/today/, "tomorrow"));

var txt1 = "today is a fine day!today is a fine day!"；console.log(txtl.replace(/today/g, "tomorrow"))；

var txt2 = "JavaScript is a fine";

console.log(txt2.replace(/javascript/i, "javascript"))；

</script>

是忽略大小写模式

13.9.1封装自己的trim 函数

function trim(str)f

return str.replace(/

(\s+$)/g,"" 11 去掉前面和后面的空

格