正则表达式

正则表达式:
 * 作用 - 针对字符串内容根据特定的规则进行匹配
 * 正则表达式
   * 定义方式 - /规则/修饰符
     * 字符和数字 - 匹配自身
     * ^ 和 $
       * ^ - 以什么开始
       * $ - 以什么结束
     * [] - 集合中的字符之间是或的关系
     * {n,m} - 表示出现至少 n 次，最多 m 次
       n <= x <= m
     * | - 或的关系(类似于运算符中的||)
   * 转义字符
     * d - 表示数字
     * w - 0-9a-zA-Z_
     * 	 - 制表符
     * 
 - 换行符
 * JavaScript中的正则表达式
   * 定义正则表达式
     * 字面量方式 - /规则/修饰符
     * 创建对象方式 - new RegExp(规则, 修饰符)
     * 说明
       * 规则 - 就是指正则表达式的语法内容
       * 修饰符
         * i - 不区分大小写
         * g - 全局搜索(将所有匹配都返回)
         * m - 多行搜索
   * RegExp类型
     * 正则表达式.test(字符串) - 返回Boolean值
       * true - 表示匹配
       * false - 表示不匹配
   * String类型
     * 字符串.match(正则表达式)方法 - 返回匹配内容
     * 字符串.replace(正则表达式, 替换内容)方法
       * 正则表达式匹配的内容 - 被替换的内容
     * 字符串.search(正则表达式)方法

 * 概念
   * DOM的全称 Document Object Model，译为文档对象模型
   * 三个对象
     * document(文档)对象
     * node(节点)对象
     * element(元素)对象
 * DOM分解
   * D - Document，实际上对应着一个对象(document)
     * document对象 - DOM将HTML页面解析为一个文档
     * 注意 - JavaScript提供的预定义对象(直接使用即可)
   * O - Object，提供一系列的对象解析这个文档
   * M - Model，就是指对象之间的关系
 * DOM树结构
   * 注意
     * 属性节点并不是子节点
     * HTML标签 - 标签/元素/节点
   * 元素和节点的区别
     * 元素 - 本身就是指标签
       * 标签的属性
       * 标签的文本
     * 节点
       * 元素节点(标签)
       * 属性节点(属性)
       * 文本节点(文本)
     * 总结 - 无论元素还是节点，只不过是解析HTML页面中的内容的一种手段
   * 其他节点(了解) - 声明节点、注释节点
   * 三种关系
     * 祖先与后代的关系
       * 祖先节点 - 父节点的父节点的父节点...
       * 后代节点 - 子节点的子节点的子节点...
     * 父与子的关系
       * 父节点
       * 子节点
     * 兄弟的关系(同一个父节点)
 * 判断节点类型
   * nodeName - 节点名称
     * 文档节点 -> #document
     * 元素节点 -> 标签名
     * 属性节点 -> 属性名
     * 文本节点 -> #text
   * nodeType - 节点类型
     * 文档节点 -> 9
     * 元素节点 -> 1
     * 属性节点 -> 2
     * 文本节点 -> 3
   * nodeValue - 节点值
     * 文档节点 -> null
     * 元素节点 -> null
     * 属性节点 -> 属性值
     * 文本节点 -> 文本内容
   * 作用
     * 如果是HTML标签的话，可以根据nodeName判断当前是什么标签
     * 可以根据nodeType判断当前获取的是什么节点
     * 如果是属性节点或文本节点的话，可以根据nodeValue获取当前的属性值或文本内容
 * 事件
   * 定义 - 实现用户与页面之间的交互瞬间
   * 事件绑定
     1. 获取当前页面中指定的标签
        document.getElementById(id)
     2. 为指定标签绑定事件
        标签.onclick = function(){
            执行的逻辑
        }
   * 事件属性 - HTML标签提供了事件属性，与事件绑定的作用相同
     * 注意 - 不推荐(HTML结构与逻辑不分离)
 * document对象
   * 获取HTML页面中的标签
     * 传统获取页面标签
       * getElementById()方法 - 通过id属性值获取对应标签
         * 由于 id 属性值唯一，只能获取指定唯一标签
       * getElementsByName()方法 - 通过name属性值获取对应标签
         * 返回一个类数组对象 - NodeList 对象
           * 含义 - 存储结构上类似于数组的存储方式，最终是一个对象(当作数组使用)
         * 注意 - 即使获取到的只有一个标签，返回的依旧是类数组结构 
       * getElementsByTagName()方法 - 通过标签名获取对应标签
         * 类似于 getElementsByName() 方法
       * getElementsByClassName()方法 - 通过class属性值获取对应标签
         * 类似于 getElementsByName() 方法
         * 注意 - 是一个新增方法 -> 可能会出现浏览器不支持
     * 通过 CSS 的选择器获取页面标签
       * querySelector(选择器)方法 - 返回第一个匹配的标签
         * 返回值 - 就是指定的标签
       * querySelectorAll(选择器)方法 - 返回所有匹配的标签
         * 返回值 - 类数组对象 -> NodeList