获取可视窗口对象
chrom *document.body
firefox *document.documentElement
获取滚动条偏移量
ele.scrollTop
ele.scrollLeft
获取可视窗口对象
var bodyObj=document.documentElement||document.body;
var scrolltop=bodyObj.scrollTop;
设置滚动条偏移
bodyObj.scrollTop=123
// 通过可视窗口对象提供的scrollTop||scrollLeft属性获取滚动条偏移量setInterval(function(){ var scrollTop_=bodyObj.scrollTop; bodyObj.scrollTop=scrollTop_+10; },30);
Dom操作方法
1、获取网页元素(网页中的节点)
ele.getElementById('id属性值'); 只返回第一个元素(网页中不能出现id值相同的两个元素)
ele.getElementsByTagNam('元素名称');返回所有符合要求的节点,以节点数组形式
ele.getElementsByName('name的属性值') 返回所有复合要求的节点,以节点数组形式
ele.getElementsByClassName('class的属性值') 返回虽有复合要求的节点,以节点数组形式
var box1=document.getElementById('box1'); var boxs=document.getElementsByClassName('box'); var box_tag=document.getElementsByTagName('div'); var box_name=document.getElementsByName('box3'); var fbox=document.getElementsByClassName('fbox')[0]; // 通过父元素调用getElement…………方法获取元素var box1_1=fbox.getElementsByClassName('box'); var box1_2=fbox.getElementsByTagName('div');
根据选择器获取元素
querySelector(选择器)
querySelectorAll(选择器)
// var boxs=document.querySelector('[name=box3]'); var boxs=document.querySelector('#box1'); // var boxs2=document.querySelectorAll('[name=box3]'); var boxs2=document.querySelectorAll('#box1');
获取兄弟元素
nextSibling 获取下一个节点(包含文本节点)
nextElementSibling获取下一个节点(不包含文本)
previousSibling获取上一个节点
previousElementSibling获取上一个节点
获取子节点
laseChild 获取指定元素中的最后一个子节点,包含文本节点
laseElementChild获取指定元素中的最后一个元素节点。忽略文本节点
firstChild 获取指定元素中的第一个子节点(包含文本)
firstElementChild 获取指定元素中的第一个子节点(忽略文本)
获取所有子节点
childNodes 获取指定元素的所有子节点(包含非元素节点)
children 获取指定元素的所有(元素)子节点
根据子元素获取父元素
console.log(fbox.parentNode); console.log(fbox.parentElement);