JavaScript高级
程序员文章站
2022-05-08 15:53:56
...
一.js使用正则表达式
1.正则表达式概述
正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串”用来表达对字符串的一种过滤逻辑。
正则表达式用来校验字符串是否满足一定的规则的公式
2.表达式的创建
步骤:
- 创建正则表达式; var reg = /正则表达式/; 或者 var reg = /正则表达式/i;
- 调用test(“字符串”); reg.test(“字符串”);
- 方式一
var reg = new RegExp("正则表达式");
//说明:正则表达式在JS中是一个对象。Regular Expression
- 方式二
var reg = /正则表达式/;
//说明:以/开头,以/结尾,中间是正则表达式
- 方式一和方式二的区别
在js中,正则表达式的两种声明方式对于“\d、\D”之类的匹配模式中,前者需要转义,而后者无需转义
前者支持字符串拼接,支持变量,更加灵活;后者对于固定的表达式,书写起来方便快捷、更加直观。
3.匹配模式
- 默认情况下, 正则表达式不忽略大小写的. 可以通过 i 改成忽略大小写模式
4.正则表达式中常用的方法
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树上才可以在网页上显示出来。
整个文档是一个文档节点
每个 HTML 元素(标签)是元素(标签)节点
HTML 元素内的文本是文本节点
每个 标签 属性是属性节点
注释是注释节点
一切皆节点,一切皆对象
3.dom定义的方法
3.1查找节点的方法
3.2增删改节点
在DOM树上创建元素分2步:
- 创建这个元素
- 把元素挂到DOM树上
3.2.1创建和修改元素的方法
3.2.2挂到DOM树的方法
四.1.使用JS操作CSS样式
1.在JS中操作CSS属性命名上的区别
2.操作CSS样式
- 方式一
标签对象.style.样式名 = "样式值"
注: 每条语句只能修改一个样式
- 方式二(批量取类名)
元素对象.className = "样式类名"
注:每条语句修改一批样式, 再自己通过css设置样式
五.JS内置对象之数组
1. 创建数组的方式
2. JS数组的特点
- 数组里面可以放不同类型的值(和Java不一样)
- 数组的长度是可变的
- 数组中是有方法的
六.JS内置对象之date
1.日期对象的创建
var 变量名 =new Date() // Date 对象会自动把当前日期和时间保存为其初始值。