一、window.document对象
(一)找元素
docunment.getElementById("id");根据id找,最多找一个;
docunment.getElementsByClassName("name") 根据classname找,找出来的是数组;
docunment.getElementsByName("name");根据name找,找出来的是数组;
docunment.getElementsByTagName("name");根据标签名找,找出来的是数组;
(二)操作内容
1. 非表单元素:
1)获取内容:
alert(a.innerHTML);//获取标签里的html代码和文字。
alert(a.innerText);//只取里面的文字
2)设置内容:
a.innerHTML = "<font color=red >hello world </font>" //如果内容有元素,编译后实现
a.innerText //会将赋的东西原样呈现
2.表单元素
取值:var t = document.f1.t1——form表单ID为f1里面的ID为t1的input;
var t = document.getElementById("id")—— 直接用ID获取。
alert(t.value)——获取input中的value值;
赋值: t.value="内容改变";
注:所有表单元素取值赋值都用value
(三)操作属性
a.setAttribute("属性名","属性值"); 设置一个属性,添加或更改都可以;
a.getAttribute("属性名");获取属性的值;
a.removeAttribute("属性名");移除一个属性。
(四)操作样式
1、添加、修改样式
对象.style.样式名称=值
2、获取样式
var ....=对象.style.样式名称
对象.offsetLeft 获取元素到可视区域左边的距离
对象.offsetTop 获取元素到可视区域顶部的距离
对象.offsetWidth 获取元素的宽度
对象.offsetHeight 获取元素的高度
(五)相关元素操作
var a = document.getElementById("id");找到a;
var b = a.nextSibling——找a的下一个同辈元素,注意包含空格;
var b = a.previousSibling——找a的上一个同辈元素,注意包含空格;
var b = a.parentNode——找a的上一级父级元素;
var b = a.childNodes——找出来的是数组,找a的下一级子元素;
var b = a.firstChild——第一个子元素,lastChild最后一个,childNodes[n]找第几个;
alert(nodes[i] instanceof Text);——判断是不是文本,是返回true,不是返回flase,用if判断它的值是不是false,可以去除空格。
二、正则表达式
用符号来描述书写规则:/ 中间写正则表达式 /
^ :匹配开头,$:匹配结尾 ; /^ve/以ve开头的 /ve$/以ve结尾
\d:一个任意的数字
\w:一个任意的数字或字母
\s:一个任意的字符串
{n}:把左边的表达式重复n遍
{m,n}:把左边的表达式重复至少m遍,至多n遍
{m, }:把左边的表达式重复至少m遍,,至多不限
+:左边的表达式,至少出现一次,至多不限,相当于{1,}
*:左边的表达式,至少出现0次,至多不限,相当于{0,}
?:左边的表达式,至少出现0次,至多出现1次,相当于{0,1}
[a,b,c]:只能取方括号中内容之一
[a-z]或[1-9]:在范围中取其一
|:代表或者; ():优先级; \:转义--“\( \)”这个才是要出现的小括号,需要转义
基本语句:/ 中间写正则表达式 /.test(要验证的字符串) 返回true或false
三、事件
1、onclick:鼠标单击触发
ondblclick:双击触发
2、onmouseover:鼠标移动上面触发
onmouseout:鼠标离开时触发

3、onblur:失去焦点时触发
onfocus:获得焦点是触发
4、onkeyup:按键抬起来的时候触发

常用正则表达式:

匹配国内电话号码:d{3}-d{8}|d{4}-d{7}  
    评注:匹配形式如 0511-4405222 或 021-87888822  
    匹配腾讯QQ号:[1-9][0-9]{4,}  
    评注:腾讯QQ号从10000开始  
    匹配中国邮政编码:[1-9]d{5}(?!d)  
    评注:中国邮政编码为6位数字  
    匹配身份证:d{15}|d{18}  
    评注:中国的身份证为15位或18位  
    匹配ip地址:d+.d+.d+.d+  
    评注:提取ip地址时有用  
    匹配特定数字:  
    ^[1-9]d*$      //匹配正整数  
    ^-[1-9]d*$    //匹配负整数  
    ^-?[1-9]d*$     //匹配整数  
    ^[1-9]d*|0$   //匹配非负整数(正整数 + 0)  
    ^-[1-9]d*|0$     //匹配非正整数(负整数 + 0)  
    ^[1-9]d*.d*|0.d*[1-9]d*$     //匹配正浮点数  
    ^-([1-9]d*.d*|0.d*[1-9]d*)$   //匹配负浮点数  
    ^-?([1-9]d*.d*|0.d*[1-9]d*|0?.0+|0)$   //匹配浮点数  
    ^[1-9]d*.d*|0.d*[1-9]d*|0?.0+|0$     //匹配非负浮点数(正浮点数 + 0)  
    ^(-([1-9]d*.d*|0.d*[1-9]d*))|0?.0+|0$    //匹配非正浮点数(负浮点数 + 0)  
    评注:处理大量数据时有用,具体应用时注意修正  
    匹配特定字符串:  
    ^[A-Za-z]+$    //匹配由26个英文字母组成的字符串  
    ^[A-Z]+$    //匹配由26个英文字母的大写组成的字符串  
    ^[a-z]+$    //匹配由26个英文字母的小写组成的字符串  
    ^[A-Za-z0-9]+$    //匹配由数字和26个英文字母组成的字符串  
    ^w+$    //匹配由数字、26个英文字母或者下划线组成的字符串  
    在使用RegularExpressionValidator验证控件时的验证功能及其验证表达式介绍如下:  
    只能输入数字:“^[0-9]*$”  
    只能输入n位的数字:“^d{n}$”  
    只能输入至少n位数字:“^d{n,}$”  
    只能输入m-n位的数字:“^d{m,n}$”  
    只能输入零和非零开头的数字:“^(0|[1-9][0-9]*)$”  
    只能输入有两位小数的正实数:“^[0-9]+(.[0-9]{2})?$”  
    只能输入有1-3位小数的正实数:“^[0-9]+(.[0-9]{1,3})?$”  
    只能输入非零的正整数:“^+?[1-9][0-9]*$”  
    只能输入非零的负整数:“^-[1-9][0-9]*$”  
    只能输入长度为3的字符:“^.{3}$”  
    只能输入由26个英文字母组成的字符串:“^[A-Za-z]+$”  
    只能输入由26个大写英文字母组成的字符串:“^[A-Z]+$”  
    只能输入由26个小写英文字母组成的字符串:“^[a-z]+$”  
    只能输入由数字和26个英文字母组成的字符串:“^[A-Za-z0-9]+$”  
    只能输入由数字、26个英文字母或者下划线组成的字符串:“^w+$”  
    验证用户密码:“^[a-zA-Z]w{5,17}$”正确格式为:以字母开头,长度在6-18之间,  
    只能包含字符、数字和下划线。  
    验证是否含有^%&'',;=?$"等字符:“[^%&'',;=?$x22]+”  
    只能输入汉字:“^[u4e00-u9fa5],{0,}$”  
    验证Email地址:“^w+[-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$”  
    验证InternetURL:“^http://([w-]+.)+[w-]+(/[w-./?%&=]*)?$”  
    验证电话号码:“^((d{3,4})|d{3,4}-)?d{7,8}$”  
    正确格式为:“XXXX-XXXXXXX”,“XXXX-XXXXXXXX”,“XXX-XXXXXXX”,  
    “XXX-XXXXXXXX”,“XXXXXXX”,“XXXXXXXX”。  
    验证身份证号(15位或18位数字):“^d{15}|d{}18$”  
    验证一年的12个月:“^(0?[1-9]|1[0-2])$”正确格式为:“01”-“09”和“1”“12”  
    验证一个月的31天:“^((0?[1-9])|((1|2)[0-9])|30|31)$”  
    正确格式为:“01”“09”和“1”“31”。  
    匹配中文字符的正则表达式: [u4e00-u9fa5]  
    匹配双字节字符(包括汉字在内):[^x00-xff]  
    匹配空行的正则表达式:n[s| ]*r  
    匹配HTML标记的正则表达式:/<(.*)>.*|<(.*) />/  
    匹配首尾空格的正则表达式:(^s*)|(s*$)  
    匹配Email地址的正则表达式:w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*  
    匹配网址URL的正则表达式:http://([w-]+.)+[w-]+(/[w- ./?%&=]*)?

js复习(二)的更多相关文章

  1. JS复习--更新结束

    js复习-01---03 一 JS简介 1,文档对象模型 2,浏览器对象模型 二 在HTML中使用JS 1,在html中使用<script></script>标签 2,引入外部 ...

  2. 前端总结·基础篇·JS(二)数组深拷贝、去重以及字符串反序和数组(Array)

    目录 这是<前端总结·基础篇·JS>系列的第二篇,主要总结一下JS数组的使用.技巧以及常用方法. 一.数组使用 1.1 定义数组 1.2 使用数组 1.3 类型检测 二.常用技巧 2.1 ...

  3. 使用jquery.qrcode.js生成二维码

    通常生成二维码的方式有两种:第一种是java代码的形式,第二种是通过Js方式. 在这里我做个记录,用js生成二维码,可以在官网下载源码:http://jeromeetienne.github.io/j ...

  4. 网站开发进阶(十四)JS实现二维码生成

    JS实现二维码生成 绪 项目开发原语:已然花费半天的时间,仍旧未能将二维码显示在订单中.但是可以在单个页面中显示二维码,结合到angularjs的控制器中就失效了,自己是真的找不到其中的原因了.费解! ...

  5. 调用 js 生成图片二维码

    一.js 生成二维码: 首先,需要引用 jQuery 和 jquery.qrcode.js.然后: //生产二维码 $("#qrcodeCanvas").qrcode({ rend ...

  6. js生成二维码 qrcode

    js生成二维码 QRcode npm 地址 1.安装qrcode //在项目文件夹中执行: npm install --save qrcode //或者,将其全局安装以使用qrcode命令行来保存qr ...

  7. QRCode.js生成二维码

    QRCode的GitHub地址: https://github.com/KeeeX/qrcodejs 该版本解决了主版本(https://github.com/davidshimjs/qrcodejs ...

  8. js复习--基础

    最近工作遇到了一些小困难,基础真的很重要,漫天高楼起于地. 一,script元素 包括type=“text/Javascript”,defer延迟到html加载完解析,src=“../../test. ...

  9. JS--我发现,原来你是这样的JS(二)(基础概念--躯壳篇--不妨从中文角度看js)

    一.介绍 这是红宝书(JavaScript高级程序设计 3版)的读书笔记第二篇(基础概念--躯壳篇),有着部分第三章的知识内容,当然其中还有我个人的理解. 红宝书这本书可以说是难啃的,要看完不容易,挺 ...

  10. js生成二维码以及点击下载二维码

    js生成二维码 jquery.qrcode.js可以快速使用页面生成二维码.但改项目有两个小问题:1.不支持中文:2.不支持二维码中间生成图片. 支持中文的jquery-qrcode jquery.q ...

随机推荐

  1. php脚本时 linux命令获取服务器IP

    exec("netstat -anp | grep smtp",$sendList);   //php脚本获取服务器邮件进程数 exec("netstat -anp |g ...

  2. LeetCode() Search a 2D MatrixII

    一开始的超时思路 int row=a.size(),col=a[0].size(); for(int i=0;i<row;i++) { if(a[i][col-1] > target &a ...

  3. GUI、GUILayout、EditorGUI、EditorGUILayout

    GUI GUI.BeginGroup(rect) //在里面画的控件,将以这个GroupRect的左上角为原点,仅此而已 GUI.EndGroup() GUILayout GUILayout.Begi ...

  4. GPU(CUDA)学习日记(十一)------ 深入理解CUDA线程层次以及关于设置线程数的思考

    GPU线程以网格(grid)的方式组织,而每个网格中又包含若干个线程块,在G80/GT200系列中,每一个线程块最多可包含512个线程,Fermi架构中每个线程块支持高达1536个线程.同一线程块中的 ...

  5. docker学习3-虚拟网络模式

    一.虚拟机网络模式 在理解docker网络隔离前,先看下之前虚拟机里对网络的处理,VirtualBox中有4中网络连接方式: NAT Bridged Adapter Internal Host-onl ...

  6. VC++ 0xC0000005: Access violation.

    public: COptionDlg(CWnd* pParent = NULL); // 标准构造函数 virtual ~COptionDlg(); TCONFIG m_tCfg; // 对话框数据 ...

  7. PHP使用Mysql事务

    <?php //数据库连接 $conn = mysql_connect('localhost', 'root', ''); mysql_select_db('test', $conn); mys ...

  8. linux服务之git

    http://www.cnblogs.com/fnng/archive/2011/08/25/2153807.html http://www.cnblogs.com/sunada2005/archiv ...

  9. mov视频转gif

    在mac上用quicktime录屏,得到一个mov视频,想转成gif,试了几个工具,感觉下面这个最好用: http://ezgif.com/video-to-gif 支持重新指定尺寸和帧率,转完gif ...

  10. mysql-mmm高可用配置说明

    http://www.cnblogs.com/gomysql/p/3671896.html 实战配置 http://www.cnblogs.com/chenmh/p/5744227.html 半同步配 ...