凭hash和html文件之间没有正斜杠的规律吗?

给新手巩固javaScript知识点用的,完全没学过的看了会看不懂的,里面的内容只是把javaScript知识点总结,并没有很详细的介绍每个知识点的意思。

由数字、字母、下划线、美元符号的一种或几种组成,且不能以数字开头,严格区分大小写
遵循驼峰命名法则:第一个单词以小写字母开始;第二个单词的首字母大写或每一个单词的首字母都采用大写字母。
匈牙利命名法则:基本原则是:变量名=属性+类型+对象描述

isNaN():不是一个数字,返回布尔值

顺序结构、逻辑分支结构、循环结构

代码执行的顺序是从上到下依次执行

表达式1?表达式2:表达式3

如果表达式1成立,返回的是表达式2的结果;如果不成立,返回的是表达式3的结果

break用于跳出代码块或循环,continue立即终止本轮循环,返回循环结构的头部,开始下一轮循环。

JavaScript 事件是由访问 Web 页面的用户引起的一系列操作。

当用户执行某些操作的时候,再去执行一系列代码。或者用来获取事件的详细信息,

如鼠标位置、键盘按键等。

javaScript可以处理的事件类型为:鼠标事件、键盘事件、HTML事件

所有的事件处理函数都会都有两个部分组成,on + 事件名称

上面代码中,先产生一个所有年龄大于等于18的数组,然后打印数组中的元素。

上面代码中,变量s1是字符串,s2是对象。
所以,String对象也叫包装对象
除了用作构造函数,String对象还可以当作工具方法使用,将任意类型的值转为字符串。

上面代码将布尔值ture和数值5,分别转换为字符串

二、字符串实例的length属性返回字符串的长度。

字符串对象是一个类似数组的对象(很像数组,但不是数组)。

上面代码中,字符串abc对应的字符串对象,有数值键(0、1、2)和length属性,所以可以像数组那样取值。

三、charAt方法返回指定位置的字符,参数是从0开始编号的位置。

//这个方法完全可以用数组下标替代。

1.slice方法用于从原字符串取出子字符串并返回,不改变原字符串。它的第一个参数是子字符串的开始位置,第二个参数是子字符串的结束位置(不含该位置)。

'JavaScript'.slice(4) // "Script"如果参数是负值,表示从结尾开始倒数计算的位置,即该负值加上字符串长度。

2.substring方法用于从原字符串取出子字符串并返回,不改变原字符串,跟slice方法很相像。它的第一个参数表示子字符串的开始位置,第二个位置表示结束位置(返回结果不含该位置)。

3.substr方法用于从原字符串取出子字符串并返回,不改变原字符串,跟slice和substring方法的作用相同。
substr方法的第一个参数是子字符串的开始位置(从0开始计算),第二个参数是子字符串的长度。

如果省略第二个参数,则表示子字符串一直到原字符串的结束。

如果第一个参数是负数,表示倒数计算的字符位置。如果第二个参数是负数,将被自动转为0,因此会返回空字符串。

上面代码中,第二个例子的参数-1自动转为0,表示子字符串长度为0,所以返回空字符串

4.indexOf方法用于确定一个字符串在另一个字符串中第一次出现的位置,返回结果是匹配开始的位置。如果返回-1,就表示不匹配。

indexOf方法还可以接受第二个参数,表示从该位置开始向后匹配。

lastIndexOf方法的用法跟indexOf方法一致,主要的区别是lastIndexOf从尾部开始匹配(最后一次出现的位置),indexOf则是从头部开始匹配(第一次出现的位置)。

另外,lastIndexOf的第二个参数表示从该位置起向前匹配。

5.trim方法用于去除字符串两端的空格,返回一个新字符串,不改变原字符串。

该方法去除的不仅是空格,还包括制表符(\t、\v)、换行符(\n)和回车符(\r)。

6.toLowerCase方法用于将一个字符串全部转为小写,toUpperCase则是全部转为大写。它们都返回一个新字符串,不改变原字符串。

7.replace方法用于替换匹配的子字符串,一般情况下只替换第一个匹配(除非使用带有g修饰符的正则表达式)。

8.split方法按照给定规则分割字符串,返回一个由分割出来的子字符串组成的数组。
它与join相反,join是把数组连接起来成字符串。

如果分割规则为空字符串,则返回数组的成员是原字符串的每一个字符。

String对象提供的静态方法(即定义在对象本身,而不是定义在对象实例的方法),主要是String.fromCharCode()。该方法的参数是一个或多个数值,代表 Unicode 码点,返回值是这些码点组成的字符串。

Math.sqrt();//返回参数的平方根,如果参数是一个负数,则返回NaN

Math.cos();//返回参数的余弦(参数为弧度值)

Math.tan();//返回参数的正切(参数为弧度值)

上面的代码中new Date()返回的是字符串,获取到了当前的时间;可以接受多种格式的参数,返回一个该参数对应的时间实例。参数为多个整数, 代表年、月、日、小时、分钟、秒、毫秒,

上面多种日期字符串的写法,返回的都是同一个时间

这些参数如果超出了正常范围,会被自动折算。比如,如果月设为15,就折算为下一年的4月

类型自动转换时,Date实例如果转为数值,则等于对应的毫秒数;如果转为字符串,则等于对应的日期字符串。所以,两个日期实例对象进行减法运算时,返回的是它们间隔的毫秒数;进行加法运算时,返回的是两个字符串连接而成的新字符串。Date.parse方法用来解析日期字符串,返回该时间距离时间零点(1970年1月1日 00:00:00)的毫秒数。

JavaScript事件本身所具有的属性,例如a标签的跳转,Submit按钮的提交,右键菜单,文本框的输入等。

注意:事件名不带on,处理函数为函数指针,布尔值代表冒泡(内到外)或捕获(外到内)

利用事件冒泡的原理,把本应添加给某元素上的事件委托给他的父级(外层)。

如果一个ul中有很多li,循环遍历所有的li,给li添加事件效率比较低,我们可以监听ul的点击事件,利用子元素的点击事件都会冒泡到父元素的特点,就可以知道什么时候点击了li。

好处:效率高,可以给未来元素添加事件

1:给目标元素添加onmousedown事件,拖拽的前提是在目标元素按下鼠标左键。

2:当onmousedown发生以后,此刻给document添加onmousemove事件,意味着此刻鼠标在网页的移动都将改变目标元素的位置。

目标元素的top = 鼠标的clientY– (鼠标和元素的纵坐标差,即offsetY)。

4:当onmousedown发生以后,此刻给document添加onmouseup事件,意味着此刻鼠标在网页的任意位置松开鼠标,都会放弃拖拽的效果。

注意在拖拽效果里,如果给元素使用了定位,那么这个元素的margin值不能为auto,而是设为0,否则会影响到拖拽的位置,也就是位置发生偏移。也可以不使用定位,这样margin值就可以设为auto;

提供了独立于页面内容而与浏览器进行交互的对象,其核心对象是window

在浏览器中,window对象(注意,w为小写)指当前的浏览器窗口。它也是所有对象的顶层对象。

“顶层对象”指的是最高一层的对象,所有其他对象都是它的下属。JavaScript规定,浏览器环境的所有全局变量,都是window对象的属性。

上面代码中,变量a是一个全局变量,但是实质上它是window对象的属性。声明一个全局变量,就是为window对象的同名属性赋值

浏览器代理检测,可以检测出来用户使用的浏览器类型,也可以检测浏览器所在的操作系统

//判断是移动端还是PC

load事件发生在文档在浏览器窗口加载完毕时。window.onload属性可以指定这个事件的回调函数。

一旦页面滚动就会触发onscroll 函数

alert(arg1)//显示带有一段消息和一个确认按钮的警告框。

confirm(arg1) //显示带有一段消息以及确认按钮和取消按钮的对话框。

history对象保存着用户上网的历史记录,从窗口被 打开的那一刻算起.

setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的编号,以后可以用来取消这个定时器。

上面代码中,setTimeout函数接受两个参数,第一个参数func是将要推迟执行的函数名,第二个参数delay是推迟执行的毫秒数。

setInterval函数的用法与setTimeout完全一致,区别仅仅在于setInterval指定某个任务每隔一段时间就执行一次,也就是无限次的定时执行。

上面代码中,每隔1000毫秒就输出一个2,会无限运行下去,直到关闭当前窗口。

上面代码中,回调函数f不会再执行了,因为两个定时器都被取消了。

不论是定时器还是延时器,就算传的时间为0毫秒,也会先执行定时器或延时器下面的代码

同步执行(顺序执行):同一时间只能执行一个事件,按顺序依次执行

异步执行:同一时间可以同时执行多个事件//延时器或定时器的匿名函数都是异步执行

由异步操作发起的请求获得的结果的快慢是根据网速快慢、服务器快慢、数据大小有关

<!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html> 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。

标准模式的排版 和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。

document.scrollingElement属性返回文档的滚动元素。也就是说,当文档整体滚动时,到底是哪个元素在滚动。

// 页面滚动到浏览器顶部

获取可视区域距离页面顶部的距离

DOM 是 JavaScript 操作网页的接口,全称为“文档对象模型”(Document Object Model)。它的作用是将网页转为一个 JavaScript 对象,从而可以用脚本进行各种操作(比如增删内容)。

浏览器会根据 DOM 模型,将结构化文档(比如 HTML 和 XML)解析成一系列的节点,再由这些节点组成一个树状结构(DOM Tree)。所有的节点和最终的树状结构,都有规范的对外接口。

DOM 只是一个接口规范,可以用各种语言实现。所以严格地说,DOM 不是 JavaScript 语法的一部分,但是 DOM 操作是 JavaScript 最常见的任务,离开了 DOM,JavaScript 就无法控制网页。另一方面,JavaScript 也是最常用于 DOM 操作的语言。后面介绍的就是 JavaScript 对 DOM 标准的实现和用法。

一个文档的所有节点,按照所在的层级,可以抽象成一种树状结构。这种树状结构就是 DOM 树。它有一个顶层节点,下一层都是顶层节点的子节点,然后子节点又有自己的子节点,就这样层层衍生出一个金字塔结构,倒过来就像一棵树。

浏览器原生提供document节点,代表整个文档。

DOM节点类型(元素和文本)

DOM 的最小组成单位叫做节点(node)。文档的树形结构(DOM 树),就是由各种不同类型的节点组成。每个节点可以看作是文档树的一片叶子。

Text:标签之间或标签包含的文本

DOM的基本操作(查询、创建、添加,修改,删除)

document.getElementById方法返回匹配指定id属性的元素节点。如果没有发现匹配的节点,则返回null。获取的元素类型为对象,只要是对象就有属性和方法

下面的方法返回的都是伪数组

document.querySelector方法接受一个 CSS 选择器作为参数,返回匹配该选择器的元素节点。如果有多个节点满足匹配条件,则返回第一个匹配的节点。如果没有发现匹配的节点,则返回null。

DOM的基本操作(查询、创建、添加,修改,删除)

createElement方法的参数为元素的标签名,即元素节点的tagName属性,对于 HTML 网页大小写不敏感,即参数为div或DIV返回的是同一种节点

Element.innerHTML属性返回一个字符串,等同于该元素包含的所有 HTML 代码。该属性可读写,常用来设置某个节点的内容。它能改写所有元素节点的内容,包括<HTML>和<body>元素。

如果将innerHTML属性设为空,等于删除所有它包含的所有节点。

DOM的基本操作(查询、创建、添加,修改,删除)

createElement方法的参数为元素的标签名,即元素节点的tagName属性,对于 HTML 网页大小写不敏感,即参数为div或DIV返回的是同一种节点

每个元素节点都有style用来读写该元素的行内样式信息

不过,连词号需要变成骆驼拼写法。

Element.style返回的只是行内样式,并不是该元素的全部样式。通过样式表设置的样式,或者从父元素继承的样式,无法通过这个属性得到。元素的全部样式要通过window.getComputedStyle()得到。

行内样式(inline style)具有最高的优先级,改变行内样式,通常会立即反映出来。但是,网页元素最终的样式是综合各种规则计算出来的。因此,如果想得到元素实际的样式,只读取行内样式是不够的,需要得到浏览器最终计算出来的样式规则。

window.getComputedStyle方法,只能用来读取样式,不能更改样式,就用来返回浏览器计算后得到的最终规则。它接受一个节点对象作为参数,返回一个 CSSStyle 实例,包含了指定节点的最终样式信息。所谓“最终样式信息”,指的是各种 CSS 规则叠加后的结果。

上面代码中,得到的背景色就是div元素真正的背景色

className属性用来读写当前元素节点的class属性。它的值是一个字符串,每个class之间用空格分割。

获取属性和设置属性(自定义属性)

Element.getAttribute方法接受一个字符串作为参数,返回同名属性的值。如果没有该属性,则返回null。

Element.setAttribute方法用于为当前节点设置属性。如果属性已经存在,将更新属性值,否则将添加该属性。该方法没有返回值。

outerHTML 包括整个标签,而不仅限于标签内部的内容

innerText只获取元素内的文本内容,html标签将被忽略

Element.children属性返回一个类似数组的对象(HTMLCollection实例),包括当前元素节点的所有子元素。如果当前元素没有子元素,则返回的对象包含零个成员,只能获取元素(标签)节点

这个属性与Node.childNodes属性的区别是,它只包括元素类型的子节点,不包括其他类型的子节点。而childNodes属性包含空白节点,能获取元素、文本节点

在box的子节点existNode前面插入一个新节点

在box尾部添加一个文本节点

只读:只能读取,不能设置(更改)

这两个属性都是只读属性

这两个方法返回的高度和宽度是数字,能进行运算;

如果父元素都没有设定位,返回的是元素body

该属性主要用于确定子元素位置偏移的计算基准,

因为对象存在堆区的是栈区的地址,在栈区开辟一个相对应的地址区存这个对象内容

所以两个对象就算内容一样也不会不相等,因为地址不一样

*:匹配前面的子表达式零次或多次(意思是该子字符串可出现可不出现)

+:匹配前面的子表达式一次或多次(意思是最少出现一次,但是如果想用‘+’,就不能在表达式里限定子字符串的位数,否则会报错)

?:匹配前面的子表达式零次或一次(意思是可不出现,但如果出现就只能出现一次)

{n}:匹配确定n次。{限定子字符串位数,不能和‘+’同时使用}

{n,}:至少匹配n次。{限定子字符串位数,不能和‘+’同时使用}

{n, m}:最少匹配n次且最多匹配m次{限定子字符串位数,不能和‘+’同时使用}

[xyz]意思是只要包含x、y、z中的任意一个字符就能匹配,返回true;

[^xyz]意思是不能包含x、y、z中的任意一个字符,如果包含就会返回false;

[a-z]意思是限定字符的范围,只要包含a-z范围内的任意一个字符就会返回true;

\s 匹配空格(包括换行符、制表符、空格符等)。

\S 匹配非空格的字符。

.:匹配除”\n”(换行)之外的任何单个字符。

定位符可以将一个正则表达式固定在一行的开始或结束。也可以创建只在单词内或只在单词的开始或结尾处出现的正则表达式。

^:匹配输入字符串的开始位置。

$:匹配输入字符串的结束位置。

\:用于匹配某些特殊字符。

正则表达式中那些有特殊含义的元字符,如果要匹配它们本身,就需要在它们前面要加上反斜杠。比如要匹配+,就要写成\+。

元字符---选择匹配符:

|:可以匹配多个规则。

竖线符号(|)在正则表达式中表示“或关系”(OR),即cat|dog表示匹配cat或dog。

封装,继承,多态,抽象

面向对象里只能出现两样东西:属性和方法,如果出现事件,需要把事件封装到方法里

继承:单继承;(父亲、孩子)

多继承:单重继承(父亲、父亲、父亲.....孩子);

多重继承(爷爷、父亲、孙子、重孙子......);

构造函数就是类,用来创建对象的,但它本质上也是对象;

多态来源于继承,表出现出不同的行为,就像是儿子继承父亲的手艺,但又和父亲制作东西的方法不一样,有自己的理解和经验

}

我要回帖

更多关于 符合es6规范的语法有 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信