东莞市长安镇做网站/营销咨询顾问
一.DOM和BOM介绍
1.JavaScript包括三大块:
①ECMAScript:JS的核心语法。(ES规范/ECMA-262标准)
②DOM:Document Object Model(文档对象模型,对网页当中的节点进行增删改的过程)HTML文档被当作一棵DOM树来看待。
③BOM:Browser Object Model(浏览器对象模型)
比如关闭浏览器窗口,打开一个新的浏览器窗口,后退、前进、浏览器地址栏上的地址等,都是BOM编程
2.BOM和DOM的区别和联系
BOM的顶级对象是window
DOM的顶级对象是:document
实际上BOM是包括DOM的
3.初次尝试DOM编程-获取文本框的value
<!DOCTYPE html>
<html><head><title>DOM编程案例-获取文本框的value</title></head><body><script type="text/javascript">window.onload = function(){document.getElementById("mybutton").onclick = function(){alert(document.getElementById("mytext").value);}}</script><input type="text" id="mytext"/><input type="button" value="获取" id="mybutton"/></body>
</html>
二.innerText和innerHTML
<!DOCTYPE html>
<html><head><title>innerHTML和innerText</title></head><body><!--innerText和innerHTML属性有什么区别?相同点:都是设置元素内部的内容不同点:innerHTML会把后面的“字符串”当作一段HTML代码来解释并执行innerText,即使后面是一段HTML代码,也只是将其当作普通的字符串来看待--><script type="text/javascript">window.onload = function(){document.getElementById("btn").onclick=function(){/*document.getElementById("div").innerHTML="<font color='red'>用户名不能为空</font>"*/document.getElementById("div").innerText="用户名不能为空"}}</script><input type="button" value="设置div中的内容" id="btn"/><div id="div"></div></body>
</html>
三.正则表达式
1.什么是正则表达式,有什么用处?
正则表达式(Regular Expression),主要用在字符串格式匹配方面
它实际上是一门独立的学科,最初用在医学方面,用来表示神经符号等。目前使用最多的是计算机编程领域,用作字符串格式匹配,包括搜索方面等。
2.常见正则表达式符号
. 匹配除换行符以外的任意字符
\w 匹配字母或数字或下划线或汉字
\s 匹配任意的空白符
\d 匹配数字
\b 匹配单词的开始或结束
^ 匹配字符串的开始
$ 匹配字符串的结束 * 重复零次或更多次
+ 重复一次或更多次
? 重复零次或一次
{n} 重复n次
{n,} 重复n次或更多次
{n,m} 重复n到m次 \W 匹配任意不是字母,数字,下划线,汉字的字符
\S 匹配任意不是空白符的字符
\D 匹配任意非数字的字符
\B 匹配不是单词开头或结束的位置
[^x] 匹配除了x以外的任意字符
[^aeiou] 匹配除了aeiou这几个字母以外的任意字符
3.使用示例
<!DOCTYPE html>
<html><head><title>关于正则表达式</title></head><body><!--qq号的正则表达式^[1-9][0-9]{4,}$email的正则表达式:^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$创建正则表达式对象1.var regExp = /正则表达式/flags;2.使用内置支持类RegExp即 var regExp = new RegExp("正则表达式","flags");其中flags可选项。如果使用语法 2 要用引号将 flag 引起来。标志可以组合使用,可用的有: g (全文查找出现的所有 pattern) i (忽略大小写) m (多行查找)(ES规范制定之后才支持m),如果前面是正则表达式,则flags不能用m,只有前面是普通字符串的时候m才可以使用test()方法正则表达式对象.test(用户填写的字符串),返回true或者false--><script type="text/javascript">window.onload = function(){document.getElementById("btn").onclick=function(){var emailRegExp = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;if(!emailRegExp.test(document.getElementById("email").value)){alert("邮箱地址不合法");}}//给文本框绑定focusdocument.getElementById("email").onfocus = function(){alert("sdasdasd");}}</script><input type="text" id="email"/><br><input type="button" value="验证邮箱" id="btn"/></body>
</html>