欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JavaScript高级

程序员文章站 2022-05-08 15:53:56
...

一.js使用正则表达式

1.正则表达式概述

正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串”用来表达对字符串的一种过滤逻辑。

正则表达式用来校验字符串是否满足一定的规则的公式

2.表达式的创建

步骤:

  1. 创建正则表达式; var reg = /正则表达式/; 或者 var reg = /正则表达式/i;
  2. 调用test(“字符串”); reg.test(“字符串”);
  • 方式一
var reg = new RegExp("正则表达式");
//说明:正则表达式在JS中是一个对象。Regular Expression
  • 方式二
var reg = /正则表达式/;
//说明:以/开头,以/结尾,中间是正则表达式
  • 方式一和方式二的区别
    在js中,正则表达式的两种声明方式对于“\d、\D”之类的匹配模式中,前者需要转义,而后者无需转义
    前者支持字符串拼接,支持变量,更加灵活;后者对于固定的表达式,书写起来方便快捷、更加直观。

3.匹配模式

  • 默认情况下, 正则表达式不忽略大小写的. 可以通过 i 改成忽略大小写模式
    JavaScript高级

4.正则表达式中常用的方法

JavaScript高级

5.常见正则表达式规则

符号 作用
\d 数字
\D 非数字
\w 单词:a-zA-Z0-9_
\W 非单词
. 通配符,匹配任意字符
{n} 匹配n次
{n,} 大于或等于n次
{n,m} 在n次和m次之间
+ 1~n次
* 0~n次
? 0~1次
^ 匹配开头
$ 匹配结尾
[a-zA-Z] 英文字母
[a-zA-Z0-9] 英文字母和数字
[xyz] 字符集合, 匹配所包含的任意一个字符

二.2.innerHTML:向一块标签区域插入html字符串

  • 支持html标签;
  • 会把之前的内容覆盖

三.DOM

1.DOM概念

文档对象模型(Document Object Model,简称DOM),可以让用户对网页中的元素(标签)进行操作

使用dom里面封装了API操作HTML的标签

2.JS里面的DOM编程

每个HTML页面在被浏览器解析的时候都会在内存中创建一棵DOM树,我们通过编写JS代码就可以访问这棵树上任何一个节点,并且对节点进行操作。通过 DOM模型,可以访问所有的 HTML 元素,连同它们所包含的文本和属性。可以对其中的内容进行修改和删除,同时也可以创建新的元素。新创建的元素对象,要挂到DOM树上才可以在网页上显示出来。
JavaScript高级
整个文档是一个文档节点

每个 HTML 元素(标签)是元素(标签)节点

HTML 元素内的文本是文本节点

每个 标签 属性是属性节点

注释是注释节点

一切皆节点,一切皆对象

3.dom定义的方法

JavaScript高级

3.1查找节点的方法

JavaScript高级

3.2增删改节点

在DOM树上创建元素分2步:

  1. 创建这个元素
  2. 把元素挂到DOM树上
3.2.1创建和修改元素的方法

JavaScript高级

3.2.2挂到DOM树的方法

JavaScript高级

四.1.使用JS操作CSS样式

1.在JS中操作CSS属性命名上的区别

JavaScript高级

2.操作CSS样式

  • 方式一
标签对象.style.样式名 = "样式值": 每条语句只能修改一个样式
  • 方式二(批量取类名)
元素对象.className = "样式类名":每条语句修改一批样式, 再自己通过css设置样式

五.JS内置对象之数组

1. 创建数组的方式

JavaScript高级

2. JS数组的特点

  • 数组里面可以放不同类型的值(和Java不一样)
  • 数组的长度是可变的
  • 数组中是有方法的
    JavaScript高级

六.JS内置对象之date

1.日期对象的创建

var 变量名 =new Date()  // Date 对象会自动把当前日期和时间保存为其初始值。

2. 日期对象常见的方法

JavaScript高级