1.通过节点关系来访问HTML元素:
Node parentNode:返回当前节点的父节点
Node previousSibling:返回当前结点的前一个兄弟节点
Node nextSibling:返回当前节点的下一个兄弟结点
Node[] childNodes:返回当前节点的所有子节点
Node[] getElementByTagName(tagName):返回当前节点的具有指定标签名的所有子节点
Node firstChild:返回当前节点的第一个子节点
Node lastChild:返回当前节点的最后一个子节点
2.访问表单控件:
action:返回表单的action值
elements:返回表单内的全部表单控件所组成的数组,只读属性
length:返回表单内表单控件的个数,只读属性
method:返回表单的method属性,通常为post和get两个属性值
target:确定提交表单时的结果窗口
reset():重设表单
submit():提交表单
3.访问列表框、下拉菜单的选项
HTMLSelectElement:
form:返回列表框、下拉菜单所在的表单对象,只读属性
length:返回列表框、下拉菜单的选项个数,只读属性
options:返回列表框、下拉菜单里所有选项组成的数组,只读属性
selectedIndex:返回下拉列表中被选中的选项的第一个列表索引
type:返回下拉列表的类型,即是否允许多选
HTMLOptionElement:
form:返回包含该选项所处的列表框、下拉列表的表单对象
defaultSelected:返回该选项是否默认被选中,只读属性
index:返回该选项在列表框、下拉列表中的索引位置,只读属性
selected:返回选项是否被选中
text:返回该选项呈现的文本内容
value:返回选项的value属性值
4.访问表格中的元素
HTMLTableElement:
caption:返回该表格的标题对象
HTMLCollection rows:返回该表格的所有表格行,只读属性
HTMLCollection tBodies:返回该表格的所有<tbody>元素组成的数组
tFoot:返回该表格的<tfoot>元素
tHead:返回表格的所有<thead>元素
HTMLTableRowElement:
cells:返回表格行内所有的单元格组成的数组,只读属性
rowIndex:返回该表格行在表格内的索引值,只读属性
sectionRowIndex:返回该表格行在其所在元素如<tbody>/<thead>元素里的索引位置,只读属性
HTMLTaeblCellElement:
cellIndex:返回该单元格在该表格行内的索引值,只读属性
5.修改HTML元素:
innerHTML:用于修改有结束标签的元素的内容
value:用于修改没有结束标签的元素的内容,如<input />等
style:用于修改目标元素的内敛CSS样式
options[index]:直接对<select />元素的指定列表项进行赋值,可用于改变列表框、下拉菜单的指定列表项
6.新增HTML元素:
1.创建结点: document.createElement(tagName);
2.复制结点:Node cloneNode(boolean);克隆当前节点,传入一个boolean类型的参数指定是否复制该节点的全部后代结点
7.添加结点:
appendChild(newNode):将指定结点添加到当前节点的最后一个子节点位置
insertBefore(newNode,refNode):将指定结点插入到refNode结点的前面
replaceChild(newNode,oldNode):将oldNode结点替换成功newNode结点
8.使用window对象:
1.访问历史使用window.history对象,该对象包含如下三个方法:
back():后退到上一个浏览页面,如果没有则没有forward过任何效果
forward():前进到下一个浏览页面,如果没有back过则没有任何效果
go(intvalue):指定前进(正数)或者后退(负数)多少个页面
2.访问页面的URL使用window.location属性,该属性包含如下几个常用属性:
hostname:制定个文档所在地址的URL地址
href:文档所在地址的主机地址
port:文档所在地址的服务端口
pathname:文档所在地址的文件地址
protocol:装载该文档所使用的协议,如http:...
3.想要获取客户端的屏幕信息可以使用window.screen属性,该属性包含如下三个属性:
width:屏幕的横向分辨率
height:屏幕的纵向分辨率
colorDepth:当前屏幕的色深
4.弹出新的窗口使用window.open(),该方法有三个参数:打开的页面url、target、style:比如:
window.open("text.html","_blank","left=0,top=0");
5.window提供了三种对话框:警告对话框、确认对话框和输入对话框,分别使用alert()/confirm()/prompt()实现。例子:
alert("easy alert");//无返回值
confirm("确认关闭");//返回boolean值,表示用户点击确认还是取消
prompt("输入密码:","placeholder");//返回String值,表示用户输入的信息
6.window提供了一个定时器,用于设置多久执行指定代码:
timer setInterval("code",interval)/void clearInterval(timer);设置、删除定时器,这类定时器指定每隔interval毫秒重复执行一次code
timer setTimeout("code",interval)/void clearInterval(timmer):也是设置定时器,不过它不会重复执行,而是只执行一次,interval指定delay延迟执行时间
7.window.navigator属性对应于Navigator对象俺那个,代表浏览该页面时所使用的浏览器,该对象包含如下几个常用的属性:
appName:返回浏览器的内核名称
appVersion:返回浏览器当前的版本
platform:返回当前浏览器所在的操作系统
使用for循环进行迭代输出所有的属性及属性值:
<code>
<script>
for(var propName in window.navigator){
document.writeln(propName+"-->"+window.navigator[propName]);
}
</script>
</code>
其中navigator对象包含了一个geolocation属性,它是一个Geolocation对象,可以用来获取浏览者的地理位置:
getCurrentPosition(onSuccess,onError,options):请求获取地理位置,第一个参数指定成功获取地理位置时的回调函数;第二个参数指定获取失败后的回调函数;第三个参数指定一些额外的参数
int watchCurrentPosition(onSuccess,onError,options):用于持续监听地理位置,相当于周期性调用getCurrentPosition(),该方法返回一个int值,是这个监听器的唯一ID标识,可以允许程序根据该ID来关闭指定监听器
void clearWatch(watchID):停止持续监听地理位置的监听器
其中:onSuccesss成功回调函数的形式如:function(position){},position表示浏览器所获取的地理信息,包含如下属性:
timestamp:返回获取地理位置时间的时间戳
coords:返回一个Coordinates对象,该对象包含了详细的地理信息:
longitude:返回经度值
latitude:返回维度值
altitude:返回高度值
accuracy:返回经度和维度的精度值
altitudeAccuracy:返回高度的精度值
speed:返回浏览器所在设备的移动速度,不能获取时返回null
heading:返回浏览器所在设备移动的方向,不能获取时返回null
timestamp:返回获取地理位置时间的时间戳
失败的回调函数形如:function(error){},error表示的是错误信息,包含如下属性:
code:返回错误代码,123,分别表示:
1.用户拒绝了位置服务
2.无法获取地址位置服务
3.获取地理位置信息超时
message:返回错误描述信息
额外的参数包括下面几个:
enableHighAccuracy:指定是否要求高精度的地理位置信息
timeout:指定获取地理位置信息时的超时时长
maximunAge:指定地理信息的缓存时间,以毫秒为单位