js学习

1、元素节点获取

具体操作方法：

① document.getElementById(id属性值);

获得一个元素节点对象

(jquery  $(#id属性值))

② document.getElementsByTagName(tag标签名称);

获得一个集合[数组]对象

document.getElementsByTagName(‘input’)[0];

document.getElementsByTagName(‘input’)[1];

2、属性值操作

①   获取属性值

元素节点node.属性名称;   //只能操作w3c规定的属性  inputnode.value

元素节点node.getAttribute(属性名称); //规定的 和自定义的都可以获取

②    设置属性值

元素节点node.属性名称 = 值;  //只能操作w3c规定的属性

 inputnode.value=’xiaoming@163.com’

元素节点node.setAttribute(名称，值); //规定的和 自定义的都可以设置

js事件

         鼠标事件：

                   onmouseover鼠标放上

                   onmouseout鼠标离开

                   onmousedown鼠标按下

                   onmouseup鼠标抬起

                   onmousemove鼠标移动

                   onclick点击事件

                   ondblclick双击事件

         键盘事件：

                   Onkeydown键盘按下

                   Onkeyup键盘抬起

                   Onkeypress键盘按键一次

         表单事件：

                   Onsubmit提交事件

                   Onreset重置事件

                   Onfocus获得焦点

                   Onblur失去焦点

                   Onchange当发生改变的时候

         加载事件：当页面加载完成之后立刻执行的事件

                   JS：window.οnlοad=init;

                   HTML:<bodyοnlοad=”init()”></body>

Window.open()  打开一个新的弹窗

Window.open(“url地址”,”name”,”参数1,参数2。。。。。。”);

参数：

         Width：窗口的宽度

         Height：窗口的高度

         Top：离顶部的距离

         Left：离左端的距离

Window三个弹窗

Window.alert()弹出一个警告或者提示的窗口

Window.prompt()弹出一个用户可以输入的内容的窗口，有提示以及默认值

         如果没写内容点击确认得到的是空，如果点击取消得到的null

Window.confirm()弹出一个确认框，确认和取消

         点击确认得到的是true点击取消得到的是false

Window.open(“url”,”name”,”参数1，参数2(设置窗口的信息)”)

例如：

window.onload = init;

function init(){

      window.open("11.html","弹窗"，“width=200,height=200,top=300,left=300”);

}

将会在当前页面出现一个小的(11.htm)弹窗

定时器：

         创建语法：

                   反复性定时器：varabc = Window.setInterval(“函数()”,时间t);每隔时间t就会执行一次函数（时间t是以毫秒为单位）

                   一次性定时器：varnewabc = Window.setTimeout(“函数()”,时间t);在时间之t后执行一次函数(只会执行一次)，时间t是以毫秒为单位的

      清除语法：要想清楚定时器，定时器必须有名字,匿名定时器没法清除

                   清除反复性定时器：Window.clearInterval(abc); 括号内跟的是以前设置的定时器的名字

                   清除一次性定时器：window.clearTimeout(newabc);

Location对象：

         Location.href：获取地址栏信息

         Location.assign(url)：加载新的文档

         Location.replace(url):替换文档

         Location.reload();重新加载

Assign和replace的区别：

         Assign是会产生历史记录的

         Replace不会产生历史记录

例如：

   window.onload = init;

   function init(){

     location.replace("11.html");

}

History对象：

         History.length访问过的url的数量

         History.back()返回前个页面

         History.forward();加载下一个页面

         History.go();跳转到指定的页面，如果参数是-1那么相当于history.back()

js中写的html代码都要变成一行，因为js中不允许html有空格

 3、正则表达式

形式：

var reg = /正则内容/     /是界定符，js里边最好使用斜杠

javascript里边正则就是”对象”

举例：

var str = "hello php0414";

 var reg =  /php/;

var rst = str.math(reg);   //匹配  字符串.math(正则)   匹配结果为 ["php"]

定义字符集组成

[0-9]匹配0123456789的一个数字

[a-z]匹配一个小写英文字母

[A-Z]匹配一个大写英文字母

[tcwad] 匹配不连续的 tcwad其中一个字母

[a-zA-Z] 随意匹配大小写英文字母的一个

[a-zA-Z0-9] 随意匹配英文字母、数字的一个

[a-zA-Z0-9_-] 随意匹配 英文字母、数字、_下划线、-中横线 的一个

[c-gwxq] 随意匹配连续的 cdefg的一个 或 w或x或q的一个

[c-g] 匹配连续的 cdefg其中一个字母

[3-7] 匹配连续的 34567其中一个数字

[p5c2m] 匹配不连续的 p5c2m 其中的一个字符

[9-4] [f-b]连续内容必须从小到大计数，否则报语法错误

正则表达式在匹配的时候，是从目标字符串的左边开始寻找第一个与正则匹配的内容，

找到立即返回

正则表达式默认匹配为”单次”

定义字符集的范围必须从小往大设置，否则系统报错：

例如：

  var str = "Today is Thursday 2016/8/4";

  var reg = /[0-9]/    //["2"]

var reg = /[7-9]/    //["8"]

var reg = /[a-z]/    //["T"]

var reg = /[uxy5]/   //["y"]

var reg = /[9-5]/   //是报错的，必须从小往大设置

var rst = str.match(reg)

 特别字符集组成

特别字符

$:匹配输入字符串的结尾的位置

^:表示字符串的开始的位置

():标记一个子表达式的开始和结束的位置

*：其前面那个单元出现0次或以上（任意次数）

.:匹配除换行符之外的任何字符

+  : 其前面那个单元出现1次或以上

？ : 其前面那个单元出现0次或1次

\    : 这个符号是用来转义的

       我们需要匹配一个 纯粹的 * , 就设置   \*  还有 \?  \+  \.  \|

|    : 指明两项之间的一个选择  或 的意思

• “.” 匹配任何字符,除换行符外
• “\d”匹配任何数字字符
• “\w”匹配任何字母或数字字符
• “\s”匹配空格

举例：

*:前面那个单元出现0次或以上（任意次数）

var  reg = /go*gle/;

var  str = "gooogle"    //gooogle

var str = ""ggle;        //ggle

+:其前面那个单元出现1次或以上

var reg = /go+gle/;

var str = "google";

var str = "ggle"   为null,必须是一次以上

^  : (托字符)匹配输入字符串的开始位置

  var str = "xiaoming like orange";

  var reg = /^like/ ;  输出null

  var reg = /^xiaoming/ 输出xiaoming,目标字符串开始位置有出现xiaoming

 
$  : (美元符号)匹配输入字符串的结尾位置。

var reg = /orange$/; 输出 orange

var reg =/like$/;输出null

^和$ 符号的作用：对目标内容的完整匹配：

var str = "1334958779"; 

var reg = /^13[0-9]{9}$/; ^和$表示，严格以13开头，后面跟9个数字，{}里边跟具体的数字的个数

( ): 标记一个子表达式的开始和结束位置。

()的名称：分组、模式单元

作用：

①提高子表达式优先级

var str = "gogogogogogle";

var reg = /(go)+(gl)e/;输出结果：[gogogogogogle,"go","gl"]

var rst = str.match(reg);

上图，通过结果可以看到

小括号的信息在结果中也给体现出来

rst[0] ------->全部匹配到的内容

rst[1] ------->第一个小括号内容

rst[2] ------->第二个小括号内容

...

rst[n] ------->第n个小括号内容

②从一个大的字符串中拆分小的字符串内容出来

var str = "<a href = "www.baidu.com"" >军事</a>

var reg =/<a .*>(.*)<\/a>/

var rst = str.match(reg);

console.log("网站主题："+rst[1]) //输出：网站主题：军事

 模式修正符组成

var  正则名称 = /正则内容/模式修正符;

模式修正符:

i------>忽略大小写

g----->全局匹配(进行全局匹配的时候不给体现“模式单元”内容)

举例：

   var str = "Beijing2008 Xiaogang1990";

i ------>忽略大小写

  var reg = /[a-z]+[0-9]+/i; 输出： Beijing2008,不区分大小写

g---->把复合的正则目标信息都给匹配出来

   var reg = /[a-z]+[0-9]+/ig; 输出： Beijing2008 Xiaogang1990,不区分大小写

非全局匹配:

rst[0]--->匹配的全部内容

rst[1]--->第一个小括号内容

rst[2]--->第二个小括号内容

全局匹配g：

rst[0]--->第一个复合模式内容

rst[1]--->第二个复合模式内容

rst[2]--->第三个复合模式内容

 \d  匹配一个数字字符，等价于[0-9]

^\d+$　　//匹配非负整数（正整数 + 0） 　
//匹配整数 ^\d+(\.\d+)?$　　//匹配非负浮点数（正浮点数 + 0） 
^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$　　//匹配正浮点数 
^((-\d+(\.\d+)?)|(0+(\.0+)?))$　　//匹配非正浮点数（负浮点数 + 0） 
^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$　　//匹配负浮点数 
^(-?\d+)(\.\d+)?$　　//匹配浮点数 
^[A-Za-z]+$          //匹配由26个英文字母组成的字符串 
^[A-Z]+$　    //匹配由26个英文字母的大写组成的字符串 
^[a-z]+$　　//匹配由26个英文字母的小写组成的字符串 
^[A-Za-z0-9]+$　　//匹配由数字和26个英文字母组成的字符串 
^\w+$　　//匹配由数字、26个英文字母或者下划线组成的字符串 
^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$　　　　//匹配email地址 
^[a-zA-z]+://匹配(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$　　//匹配url 
匹配中文字符的正则表达式： [\u4e00-\u9fa5] 
匹配双字节字符(包括汉字在内)：[^\x00-\xff] 
匹配空行的正则表达式：\n[\s| ]*\r 
匹配HTML标记的正则表达式：/<(.*)>.*<\/>|<(.*) \/>/ 
匹配首尾空格的正则表达式：(^\s*)|(\s*$) 
匹配Email地址的正则表达式：\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)* 
匹配网址URL的正则表达式：^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$ 
匹配帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$ 
匹配国内电话号码：(\d{3}-|\d{4}-)?(\d{8}|\d{7})? 
匹配腾讯QQ号：^[1-9]*[1-9][0-9]*$ 
下表是元字符及其在正则表达式上下文中的行为的一个完整列表，具体到每个正则表达式符号： 
\ 将下一个字符标记为一个特殊字符、或一个原义字符、或一个后向引用、或一个八进制转义符。 
^ 匹配输入字符串的开始位置。如果设置了 RegExp 对象的Multiline 属性，^ 也匹配 ’\n’ 或 ’\r’ 之后的位置。 
$ 匹配输入字符串的结束位置。如果设置了 RegExp 对象的Multiline 属性，$ 也匹配 ’\n’ 或 ’\r’ 之前的位置。 
* 匹配前面的子表达式零次或多次。 
+ 匹配前面的子表达式一次或多次。+ 等价于 {1,}。 
? 匹配前面的子表达式零次或一次。? 等价于 {0,1}。 
{n} n 是一个非负整数，匹配确定的n 次。 
{n,} n 是一个非负整数，至少匹配n 次。 
{n,m} m 和 n 均为非负整数，其中n <= m。最少匹配 n 次且最多匹配 m 次。在逗号和两个数之间不能有空格。 
? 当该字符紧跟在任何一个其他限制符 (*, +, ?, {n}, {n,}, {n,m}) 后面时，匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串，而默认的贪婪模式则尽可能多的匹配所搜索的字符串。 
. 匹配除 "\n" 之外的任何单个字符。要匹配包括 ’\n’ 在内的任何字符，请使用象 ’[.\n]’ 的模式。 
(pattern) 匹配pattern 并获取这一匹配。 (?:pattern) 匹配pattern 但不获取匹配结果，也就是说这是一个非获取匹配，不进行存储供以后使用。 (?=pattern) 正向预查，在任何匹配 pattern 的字符串开始处匹配查找字符串。这是一个非获取匹配，也就是说，该匹配不需要获取供以后使用。 (?!pattern) 负向预查，与(?=pattern)作用相反 x|y 匹配 x 或 y。 
[xyz] 字符集合。 
[^xyz] 负值字符集合。 
[a-z] 字符范围，匹配指定范围内的任意字符。
[^a-z] 负值字符范围，匹配任何不在指定范围内的任意字符。 
\b 匹配一个单词边界，也就是指单词和空格间的位置。 
\B 匹配非单词边界。 
\cx 匹配由x指明的控制字符。 
\d 匹配一个数字字符。等价于 [0-9]。 
\D 匹配一个非数字字符。等价于 [^0-9]。
 \f 匹配一个换页符。等价于 \x0c 和 \cL。 
\n 匹配一个换行符。等价于 \x0a 和 \cJ。 
\r 匹配一个回车符。等价于 \x0d 和 \cM。 
\s 匹配任何空白字符，包括空格、制表符、换页符等等。等价于[ \f\n\r\t\v]。 
\S 匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。 
\t 匹配一个制表符。等价于 \x09 和 \cI。
\v 匹配一个垂直制表符。等价于 \x0b 和 \cK。 
\w 匹配包括下划线的任何单词字符。等价于’[A-Za-z0-9_]’。
\W 匹配任何非单词字符。等价于 ’[^A-Za-z0-9_]’。
\xn 匹配 n，其中 n 为十六进制转义值。十六进制转义值必须为确定的两个数字长。 
\num 匹配 num，其中num是一个正整数。对所获取的匹配的引用。 
\n 标识一个八进制转义值或一个后向引用。如果 \n 之前至少 n 个获取的子表达式，则 n 为后向引用。否则，如果 n 为八进制数字 (0-7)，则 n 为一个八进制转义值。 
\nm 标识一个八进制转义值或一个后向引用。如果 \nm 之前至少有is preceded by at least nm 个获取得子表达式，则 nm 为后向引用。如果 \nm 之前至少有 n 个获取，则 n 为一个后跟文字 m 的后向引用。如果前面的条件都不满足，若 n 和 m 均为八进制数字 (0-7)，则 \nm 将匹配八进制转义值 nm。 \nml 如果 n 为八进制数字 (0-3)，且 m 和 l 均为八进制数字 (0-7)，则匹配八.