JavaScript 基础 二
2015-07-26 15:08
417 查看
浏览器对象
•窗口对象(Window)–Window对象处于对象层次的最顶端,它提供了处理浏览器窗口的方法和属性。
–
•位置对象(Location)
–Location对象提供了与当前打开的URL一起工作的方法和属性,它是一个静态的对象。
•历史对象(History)
–History对象提供了与历史清单有关的信息。
•文档对象(Document)
–document对象包含了与文档元素(elements)一起工作的对象,它将这些元素封装起来供编程人员使用。这是我们主要使用的对象,实际上,js是把所有的html元素(也就是所有标签)视为对象,比如一个<div>就是一个div对象。而这些对象都从属于document对象
•各种浏览器对象形成了一种层次模型,我们称其为文档对象模型(Document Object Model),简称DOM
浏览器对象的引入方式
•通过文档对象模型中的层次关系引用–例如:在引用forms对象时,使用 window.document.forms
•数组型浏览器对象的引用
–在文档对象模型中,有些对象属于数组型对象,如document对象下一层的images、links、forms等对象,在引用这种数组对象时,可以使用对象在数组中的位置(下标)来引用
–例如:window.document.forms[0],表示引用文档中的第一个表单。
•注:
–Window对象作为文档对象模型中的最顶层对象,JavaScript认为它是默认的,因此可以不写出来。如:window.document.forms可以写成document.forms
–例如document.forms[1].submit(),就是让第二个表单进行提交
•通过对象的name属性来引用
–例如:引用一个name属性是form1的表单对象,使用window.document.form1。
–或代码:document.getElementsByName(“form1”)。
获取到所有name是form1的标签组成的一个对象数组
注意:IE中这个方法可能无效
•通过对象的id属性来引用
–例如:document.getElementById(“myid”)得到的是id为myid的表单对象
–注意,方法名是getElementById,而不是Elements,注意最后的S
–推荐使用此方法。注意要使用此方法必须保证id的唯一性
•通过标签名来引用
document.getElementsByTagName(“标签名”)
例如标签名写div,就会获取到所有div组成的一个对象数组
浏览器对象的属性
•标签被视为浏览器对象,我们自然可以引用和改变对象的属性。引用属性的方法就是对象后面加上点和属性名。例如:document.getElementById(“myid”).width=“100px”;
标签的width属性被改变为100px
•标签的样式也是它的属性,同样可以改变,例如:
var tag=document.getElementById(“myid
tag.style.backgroundColor =“#AAA”;
标签的样式中的背景颜色被改变为代码AAA表示的颜色。
需要注意的是,样式属性的名字并不是完全跟css里写法一样,例如background-color属性,在js代码中要写成backgroundColor
具体哪种属性在js中怎么写,可查阅css帮助手册
•标签对象还有一些隐含的属性,js默认赋予的。例如tagName,表示该标签的类型。一个div标签对象,它的tagName属性的值就是div
•outerHTML、innerHTML、innerText属性
•这三个属性分别代表了:
outerHTML:标签对象本身及其内部所有内容,包括其他标签
innerHTML:标签对象内部所有内容,包括其他标签
innerText:标签对象内部所有文本
下图以一个div为例,演示了这三个属性的范围区别
•浏览器对象是可以自己定义属性的,例如:
<div myattr=“abc” id=“md”></div>
•给这个div标签定义了一个叫myattr的属性
4000
,并赋值为abc
•通过代码document.getElementById(“md”).myattr可以获取到这个自定义属性的值,也就是abc。当然也可以通过直接赋值来改变它
•注意:不同浏览器对自定义属性的支持程度不同
浏览器对象的一般方法
•focus ()方法,让一个标签获取焦点,例如:document.getElementById(“md”).focus();
调用了id为”md”的标签的focus方法,结果是该标签被选中
•submit()方法,仅限表单对象,效果如同按下提交按钮
•reset ()方法,仅限表单对象,效果如同按下重置按钮
windows对象的方法
•setInterval ()方法,定时调用函数。通常用window对象调用,当然window可以省略不写。语法是:setInterval(“函数名()”,间隔时间)
间隔时间的单位是毫秒,例如:var end = setInterval(“clock()”, 500)
意思是每隔500毫秒调用一次clock()方法。这效果类似java的线程。
你可以多次使用该方法,从而启动多个线程。
该方法的返回值是该线程的编号,范例中用名叫end的变量接收了。
•clearInterval(线程编号)方法,结束setInterval ()方法启动的线程。如上述范例,当想要结束这个线程,就可以调用
•window. clearInterval(end) 同样的,window可以省略不写
Window对象也就是窗口对象,处于文档对象模型的最顶层,代表当前浏览器窗口。
•主要介绍两个方法:
–open(“url”, [“window name”[, “features表”]])
功能:打开一个新的窗口
参数说明:
–url:要打开窗口的url地址
–Window name是新打开窗口的名称
–Window features 是新窗口的实际特性(窗口的外观)可选项
Window features的可能参数:
–height 窗口的高度
–width 窗口的宽度
–menubar是否有菜单
–scrollbars 是否有滚动条
–resizable 窗口大小是否可以改变
–close()
功能:关闭窗口
•介绍:Window对象也就是窗口对象,处于文档对象模型的最顶层,代表当前浏览器窗口。
•主要介绍两个方法:
–open(“url”, [“window name”[, “features表”]])
功能:打开一个新的窗口
参数说明:
–url:要打开窗口的url地址
–Window name是新打开窗口的名称
–Window features 是新窗口的实际特性(窗口的外观)可选项
Window features的可能参数:
–height 窗口的高度
–width 窗口的宽度
–menubar是否有菜单
–scrollbars 是否有滚动条
–resizable 窗口大小是否可以改变
–close()
功能:关闭窗口
window的三种对话框方法
•alert()方法弹出一个显示信息的警示对话框
alert("您好")
•confirm()方法 弹出带有提示信息的确认对话框,根据点击返回逻辑值
flag=confirm("确认删除吗?")
•prompt()方法弹出一个带有输入信息的对话框,返回所输入的值
name=prompt("请输入你的名字")
document对象的方法
•document对象是JavaScript实现网页各种功能中最常用的基本对象之一,它代表浏览器窗口中的文档,可以用来处理文档中包含的html元素,如表单,图像,超 链接等。•write()
–作用:向文档中写入文本
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- Extjs4.0 最新最全视频教程
- Javascript中toFixed方法的改进
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 5个常见可用性错误和解决方案
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 异步流程控制:7 行代码学会 co 模块
- JavaScript拆分字符串时产生空字符的原因
- IE8开发人员工具教程(二)
- 在flex中执行一个javascript方法的简单方式
- Flex结合JavaScript读取本地路径的方法
- js可突破windows弹退效果代码
- JSP脚本漏洞面面观
- PowerShell中执行Javascript的方法示例
- javascript asp教程第六课-- response方法