操作元素--字符串对象-日期对象-Array对象(数组)-Math对象-计时器

---寻找元素
通过id找到html元素
var nv=document.getElementById("id名").innerHTML="改变内容";
通过标签名找到html元素
document.getElementByTagName("标签名")//相同元素中的第一个

---通过DOM对象改变CSS
语法:document.getElementById(id).style.property=new style
document.getElementById("div").style.background="red";


---事件句柄EventListener
document.getElementById(id).addEventListener("click",hello函数);


---字符串对象
在字符串中查找字符串:indexOf()
内容匹配:match()
替换内容:replace()
转换大小写:toUpperCase()/toLowerCase()
字符串转数组:var str="hello like hah"--也可用逗号隔开
var s=str.split(" ");


---日期对象
当前日期
var data=new Date();
获取年份
getFullYear();
getTime();获取毫秒
getDay();获取星期
setFullYear();设置具体的日期

获取时分秒
function startTime(){
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
m=checkTime(m);
s=checkTime(s);
document.getElementById("timetext").innerHTML=h+m+s;
自己调用自己
刷新
t=setTimeout(function(){
starTime();
},1000);
}
防止长度变化
加一个判断
function checkTime(i){
if(i<10){
i="0"+i;
}
return i;
}


------Array对象
1.使用单独的变量名来存储一系列的值
2.数组的创建
例子:var myArray=["Hello","iwen","ime"];
3.数组的访问:
通过指定数组名以及索引号码,你可以访问某个特定的元素。
注意:[0]是数组的第一个元素。[1]是数组的第二个元素
4.数组常用的方法:
concat();合并数组
sort();排序
push();末尾追加数组
reverse();数组元素反转

-----Math对象
1.Math对象:
执行常见的算数任务
2.常用方法:
round();四舍五入
random();返回0-1之间的随机数
max();返回最高值
min();返回最低值
abs();返回绝对值
Math.max(10,20,1);


----DOM对象控制HTML
方法
getElementsByName();获取name
getElementsByTagName();获取元素
getAttribute();获取元素属性---
setAttribute();访问设置元素属性---setAttribute("属性","赋值")
childNodes();访问子节点
parentNode();访问父节点
createElement();创建元素节点
createTextNode;创建文本节点
insertBefore();插入节点
removeChild();删除节点
offsetHeight;网页尺寸-高度获取宽高
scrollHeight;网页尺寸--包含滚动条

----js浏览器对象
1.window对象
全局变量是window 对象的属性
全局函数是window对象的方法
wondow.innerHeight-浏览器窗口的内部高度
window.open()-打开新窗口
window.close()-关闭当前窗口
2.计时器
计时事件:通过使用js,我们哟能力做到在一个设定的时间间隔
之后来执行代码。而不是在函数被调用后立即执行;
--setlnterval();间隔指定的毫秒数不停地执行指定的代码
clearlnterval();方法用于停止setlnterval()方法执行的函数代码
--setTimeout();暂停指定的毫秒数后执行指定的代码
clearTimeout();方法用于停止执行
var mytime = setInterval(function(){
getTime();//每隔1秒执行调用一次
},1000);
function getTime(){
var d=new Date();
var t=d.toLocaTimeString();获取时分秒
document.getElementById("ptime").innerHTML=t;
}

暂停执行--
function stopTime(){
clearInterval(mytime);
}

3.History对象
window.history对象包含浏览器的历史(url)的集合
history.back()-与在浏览器点击后退按钮相同
history.forward()-与在浏览器中点击按钮向前相同
history.go()-进入历史中的某个页面
4.Location对象

Screen对象
Navigator对象
弹出窗口
Cookies
History对象
返回上一个页面,
history.back();与在浏览器点击后退按钮相同
history.go(-1);进入历史中的某个页面
history.forword();

Location对象
用于获取当前页面的地址,并把浏览器重定向到新的页
Screen对象
screen.availWidth--可用屏幕的宽度
screen.availHeight--可用的屏幕高度
screen.Height-屏幕高度

posted @ 2019-08-04 17:59  小白咚  阅读(249)  评论(0编辑  收藏  举报