JSDom知识
组成:ECMAscript, BOM, DOM
ECMAscript:语法核心
BOM:浏览器对象模型
window:窗口
open close
定时器:有返回 返回的是这个定时器的对象
(1)window.setInterval();//连环炸弹==>间隔执行
(2)window.setTmeout();//定时炸弹==>延迟执行
setTmeout(function(){},1000);
清除定时器:(1).clearTmeout 清除Tmeout定时器
(2).clearInterval 清除Interval定时器
histroy:历史记录
go(-1) back()
location:地址栏
location(JS页面跳转) href="" replace()
document:文档
DOM:文档对象模型
核心思想:找到元素,操作元素
JS找元素:会返回元素对象
document.getELementById(); 唯一确定
document.getELementsByName();//Name的属性值 返回的是数组
document.getELementsByTagName();//TagName的标签名 返回的是数组
document.getELementsByClassName(); //ClassName Class的属性值 返回的是数组
JS操作元素:
操作元素内容:
非表单元素:Dom.innerHTML
表单元素:Dom.value
操作元素属性:
Dom.getAttribute();//获取属性值
Dom.setAttribute();//设置属性值
Dom.removeAttribute();//移除属性值
操作元素样式:
Dom.style.color =red
操作元素事件
操作元素添加删除
//打开页面
var w=[];
function tiaozhuan(){
for(var i=0;i<10;++i){
w[i]=window.open();
}
}
//关闭页面
function close(){
for(var i=0;i<10;++i){
w[i].close();
}
}
//页面加载完成
window.onload=function(){
alert("页面加载完成");
}
//时间日期对象
var dd = new Date(),
year = dd.getFullYear(),//年
month = "0"+(+dd.getMonth()+1),//月
date = dd.getDate(),//日
hours = dd.getHours(),//时
minutes=dd.getMinutes(),//分
seconds=dd.getSeconds(),//秒
var str = y+‘-‘+m+‘-‘+d+‘ ‘+h+‘:‘+f+‘:‘+s;
document.write(str);
//Dom操作实例
<button id="one">点我呀</button>
<button id="two" style="display:none">看不见我</button>
<script>
var btn1=document.getELementById("two");
btn1.setAttribute(‘onClick‘,‘showTwo()‘);
//id是two的默认隐藏 点击one显示two元素
function showTwo(){
//找到id为Two的元素
var btn=
document.getELementById("two");
if(btn.style.display=="block"){
btn.style.display="none";
}else{
btn.style.display="block";
}
}
</script>
原文地址:https://www.cnblogs.com/Prinlily/p/9368651.html