JS学习-第七节

一,正则表达式

  用于定义一些字符串的规则,计算机可以根据正则表达式来检查一个字符串是否符合规则,获取将字符串中符合规则的提取出来。

(1)构造函数创建正则表达式

  var 变量=new RegExp("正则表达式","匹配模式");//匹配模式中i是忽略大小写,g是全局匹配

  var reg=new RegExp("a");

  正则表达式的方法:

  var result=reg.test(str);

  console.log(reg.test("bcbc"));//false

 

(2)使用字面量创建正则表达式:

  reg=/a/i;

  reg=/a|b/;//匹配a或b

(3)[]中也是或的关系

  [ab]==a|b;

(4)匹配规则中前面加一个^则是除了的意思。

 

二,正则表达式与字符串相连接

  var result=str.split(/[A-z]/);

 

  search();//可以搜索字符串中是否含有指定内容。只会查找第一个如:

  str.research(/a[bef]d/);

 

  match()会将匹配到的内容封装到一个数组中返回,即是只查到一个结果。

 

  str.replace("a","@_@");//后面的替换前面的。

  

  var reg=/a{3}/;//正好出现3次a,只对括号前面的字符有作用

  var reg=/a{1,3}/;//出现1-3次

  var reg=/a{3,}/;//出现三次以上

  var reg=/ab+c/;//至少出现一次b

  

  var reg=/^a/;//表示a开头

  var reg=/a$/;//表示a结尾

 

  手机号匹配:var phone=/^1[3-9][0-9]{9}$/;

 

  var reg=/./;//匹配任意字符

  var reg=/\\/;匹配\

  var reg=/\./;匹配.

 

  \w表示任意字母数字和下划线

  \W除了字母数字下划线

  \d任意数字【0-9】

  \D除了数字

  \s空格

  \S除了空格

  \b单词边界;reg=/\bchild\b/;

  \B除了单词边界

 

  str.replace(/^\s*|\s*$/,"");去除前后的空格

 

三,邮件的正则

/^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/;

  

四,DOM(Document Object Model)文档对象模型

  <body>

    <button id="btn">我是一个按钮</button>

    <script type="text/javascript">

      var btn=document.getElementById("btn");

      btn.innerHTML="I am a studentButton";

    </script>

  </body>

 

五,事件:

  就是用户和浏览器之间的交互行为。比如,点击按钮,鼠标移动,关闭窗口。往JS中加代码会行为和结构耦合,应该往script中加。

 

获取对象,通过对象的属性进行绑定事件:

var btn=document.getElementById("btn");

btn.onclick=function()//单击响应函数

{alert("123");

}

btn.ondblclick=function()//双击响应函数

{alert("123");

}

 

六,文档的加载

  文档加载,自上而下。要把script事件放在下面。

 

  onload事件会在整个页面加载完成之后再触发,为window绑定一个个onload事件.该事件对应的响应函数将会在页面加载完事之后触发。这样就可以确保我们的代码执行时左右的DOM对象都已经加载完毕了。

window.onload=function()

{

var btn=document.getElementById("btn");

btn.onclick=function(){

alert("123");

}

}

 

七,DOM查询

标签就是元素,元素就是标签

 

通过document对象调用

1,getElementById()

通过id属性获取一个元素节点对象

2,getElementsByTagName()

通过标签名获取一组元素节点的对象

3,getElementsByName()

通过name获取一组元素节点对象

innerHTML用于获取元素内部的HTML代码的,对于字结束标签,这个属性无意义

如果需要读取元素节点的属性,直接用元素.属性名

当读取class时候,需要用元素.className

 

1,childNodes属性会算上包括文本节点在内的所有子节点

2,children可以获取当前所有元素的子元素

3,firstElementChild获取当前元素的第一个子元素

 

posted @ 2021-08-11 20:17  热心市民陆女士  阅读(32)  评论(0编辑  收藏  举报