Day03-JavaScript高级编程
来源:互联网 发布:社交网络 thunder 编辑:程序博客网 时间:2024/05/16 07:26
标签: HTML基础
- 01复合类型对象
- BOM编程 用来操作浏览器
- Windows对象
- 04 DOM文档对象模型 用来操作网页的文档
- 节点
- DOM属性
01复合类型对象
- 内置对象
- 自定义对象
在js函数当中可以在定义函数 - 浏览器对象(重点)BOM,woindows,document
- 数组
数组是一群元素的集合,初始化大小不会影响数组的实际长度。
数组里面可以存储复合类型函数 就是一片功能代码快。
02 BOM编程 (用来操作浏览器)
就是浏览器对象模型
作用1.就只操作主流浏览器的各个组成部分。
03 Windows对象
浏览器一遇到`<body>`或 `frameset`
属性
status
,opener
方法setTimeOut
setInterval
事件event
浏览器加载时自动创建
鼠标事件onmousemove
onmouseout
焦点事件,
键盘事件onkeyup
表单: 阻塞是提交onsubmit
, 用来验证表单的内容
动态事件,就是动态的给标签添加事件,不直接在标签上面的直接添加事件函数、
问题:
常用对象
location对象
Screen 用户的屏幕信息
doucment 文档对象
history 浏览器历史go(0)
方法,刷新
04 DOM文档对象模型 (用来操作网页的文档)
- D 表示 HTML/JSP/XML,
- O 表示对象,以对象的方式访问web页面中的元素
- M 模型是一种规则,在DOM看来,所有的文档,加载到内存以后都是一个倒状树。
节点
- 由结构图中我们可以看到,整个文档就是一个文档节点 document
- 而每一个HMTL标签都是一个元素节点(divElement)
- 标签中的文字则是文本节点(divTextElement)
- 标签的属性是属性节点(idAttributeElement)
一切都是节点……
- 查找元素的节点
getElementById()
,此方法只是用于document
对象 getElementsByNam()
寻找有着给点name属性的所有元素,返回的是一个节点集合getElementByTagName()
寻找给定标签名字的所有元素。因此放回 一个节点集合 该方法不必非得用在整个文档上。它也可以用来在某个特定元素的子节点当中寻找有着给定标签名的元素。- 元素属性
getAttribute()
返回一个给定元素指定属性的值var nodValue = document.getElementsByTagName("input")[0].getAttribute("type");
setAttribute(attributeName,attributeValue)
如果这个属性已经存在,它的值将被替代getAttributeNode()
通过属性获得属性节点removeAttribute()
删除指定熟悉的节点
- 查找元素的节点
05 DOM属性 –
nodeName
其内容是是给点节点的名称,只读属性nodeType
返回一个整数,代表节点的类型,1代表元素节点,2代表属性节点,3代表文本节点。只读属性nodeValue
返回给定当前节点的当前值,如果是文本节点返回的是文本值,如果是属性节点,返回的是属性值,如果是元素节点返回的是NULL,该属性可读写,但是不能给属性设置值,但是可以给replaceChild()
替换节点
总结: javascript就是用来操作网页的一种语法。
其中出现了bom来操作整个浏览器窗体,衍生出许多的对象。
因为网页是文本的形式出现,所以出现了操作DOM的文本模型来处理<body>
标签里面的内容,我们把这些这些标签组成的网页想成一个文本树,数和数之间就有了节点, 因此JavaScript有了许多获得节点的方法,由于节点的不同会有标签节点,文本,属性节点。 大多数可以查询Api可以查询到。、
最后的作业 验证用户的输入是否正确
当用户提交表单后,对表单中的所有选项进行验证,全部通过后,方可提交
1用户名必填且英文或中文
2密码必填且8位数字
script type="text/javascript"> //1.定位到表單的位置, //2.設置那個柱塞方法 var fromArray = document.forms; fromArray[0].onsubmit = function() { //验证 var userName = document.getElementById("user_ID").value; if ((/[a-zA-Z]{8,}/.test(userName)) || (/[\u4e00-\u9fa5]{8,}/.test(userName))) { //用户名输入正 var password = document.getElementById("pasw_ID").value; if (/[0-9]{8,}/.test(password)) { //密码验证正确 alert("注册成功") return true; } else { alert("密码错误") } } else { alert("用户名必须为英文") } return false; } </script>
0 0
- Day03-JavaScript高级编程
- day03 Javascript高级
- day03 JavaScript
- JavaScript高级编程入门
- JavaScript高级编程
- JavaScript高级编程II
- JavaScript高级编程 III
- javascript 高级编程1.0
- javascript高级编程
- 《Javascript高级编程》 数据类型
- day03&day04_初涉JavaScript
- gtk图形界面编程day03
- JavaScript高级编程笔记(1)
- javascript高级编程--匿名函数
- JavaScript高级编程阅读笔记
- JavaScript高级编程(学习笔记)
- javascript高级编程-ECMAScript 值
- Javascript高级编程读书笔记一
- 逆转交替合并两个链表
- [Leetcode 61, Medium] Rotate List
- MyBatis单条插入后返回自增的id
- 黑马程序员————Java基础日常笔记---IO流二
- 【树形dp】hdu 2412 Party at Hali-Bula
- Day03-JavaScript高级编程
- 理解微软100题
- 如何使用Word2007发布csdn博文
- 求质因数问题
- [Leetcode 62, Medium] Unique Paths
- LightOJ1038-Race to 1 Again
- Android overlay系统
- ------------参数传递的四种形式----- URL,超链接,js,form表单
- github