纵有疾风起
人生不言弃

HTML 学习笔记 May 15,2017 dom编程开山篇、dom编程实例(乌龟抓鸡)、bom介绍.dom对象层次图.dom对象(window对象①)、dom对象(window对象②)

HTML 学习笔记 May 15,2017 dom编程开山篇、dom编程实例(乌龟抓鸡)、bom介绍.dom对象层次图.dom对象(window对象①)、dom对象(window对象②)

HTML 学习笔记 May 15,2017 dom编程开山篇、dom编程实例(乌龟抓鸡)、bom介绍.dom对象层次图.dom对象(window对象①)、dom对象(window对象②)插图
屏幕快照 2017-05-20 11.23.12.png

window.alert(mytab.rows[0],cells[2],innerText); // 弹出第一行,第三列的内容

HTML 学习笔记 May 15,2017 dom编程开山篇、dom编程实例(乌龟抓鸡)、bom介绍.dom对象层次图.dom对象(window对象①)、dom对象(window对象②)插图1
屏幕快照 2017-05-20 11.23.19.png

1、alert() 显示消息和确认按钮的警告框
2、confirm() 显示消息以及确认按钮和取消按钮的对话框
3、compile()
4、setInterval() 按照指定的周期(毫秒计) 来循环调用函数或者计算表达式
5、clearInterval() 取消由 setInterval()设置的定时器
6、setTimeout() 指定的毫秒数后调用函数或者计算表达式
7、clearTimeout() 取消由setTimeout()设置的定时器

function test() {
confirm(“你要删除”); // 点击确定返回1 ,点击取消返回0
}

setInterval(“sayHello()”,1000); // 每隔1 s 执行一次 sayHello() 函数

// 时钟⬇️
function showTime () {
// 在元素间的文本就是通过 对象.innerText
document.getElementById(“mytime”).innerText = new Date().toLocaleString();
}
setInterval(“showTime()”,1000); // 每隔1 s 执行一次 sayHello() 函数

// 让静态图片动起来
function runChild() {
// 得到 img 对象
var myimg = document.getElementById(“myimg”);
myimg.src = ((n++%8) + 1) + “.png”;
}
setInterval(“runChild()”,1000); // 每隔1 s 执行一次 sayHello() 函数

小人可以走走停停啦

var n = 1;
var count = 0;
// 让静态图片动起来
function runChild() {

count++;
if (count == 11) {
// 停止这个定时器
clearInterval(myTimer);

// 停止 10s 钟继续走
setTimeout(“reRun()”,5000);
}
// 得到 img 对象
var myimg = document.getElementById(“myimg”);
myimg.src = ((n++%8) + 1) + “.png”;
}

var myTimer=setInterval(“runChild()”,1000); // 每隔1 s 执行一次 sayHello() 函数

function reRun() {
myTimer = setInterval(“runChild()”,1000);
}

// 5s 后调
setTimeout(“showTime()”,5000); // 5s 后调用

window 对象
1、moveTo() 把窗口的左上角移动到一个指定的坐标
2、moveBy() 可相对窗口的当前坐标把它移动指定的像素
3、resizeBy() 按照指定的像素调整窗口的大小
4、resizeTo() 把窗口的大小调整到指定的宽度和高度
5、open() 打开一个新的浏览器窗口或者查找一个已命名的窗口
6、close() 关闭窗口
7、closed 返回窗口是否已被关闭
8、status 设置窗口状态栏的文本
9、operer 返回对创建此窗口的窗口的引用
10、onload 页面装载
11、onunload 关闭窗口

取消延迟调用的方法
function test() {
window.alert(“abc”);
}
// 3s 之后执行 test() 方法
var mytimer = setTimeout(“test()”,3000);
// 取消 timeout
clearTimeout(mytimer);

// moveTo
function test2() {
window.moveTo(100,100); // 这个是浏览器的左上角会定位到 100,100 的位置
}

function test2() {
window.moveTo(100,100); // 这个是浏览器的左上角会定位到 100,100 的位置
}

function test2 () {
window.open(“newWindow.html”,”_self”); // 在当前页面打开新窗口
}

function test2 () {
window.open(“newWindow.html”,”_self”); // 在当前页面打开新窗口
}

function test2 () {
window.open(“newWindow.html”,”_blank”,”channelmode = ys,resizable = n0;width = 20; height = 100,location = no”);
}

// 返回给父视图一个值,改变父视图中的内容
function notify() {
var val = document.getElementById(“info”).value;
window.alert(val);
opener.document.getElementById(“myspan”).innerText = val; // 父视图中的 myspan 的 value 内容换成了 val 的内容
}

返回值为真的时候跳转到第二个页面

<input type=”submit” value=”登录” onclick=”return checkuser();” />

function checkuser() {
if ($(‘uname’).value == “doubi” && $(‘pwd’).value = “123”) {
window.alert(‘ok’);
return true;
} else {
window.alert(‘no ok’);
return false;
}
}

setTimeout(“javascript:window.open(‘manage.html’)”,5000); // javascript:window.open(‘manage.html’) 这句话直接当成脚本执行

返回到上个页面

history.back(); // 等价于 history.go(-1);

screen 对象
1、height 返回显示屏幕的高度(按像素)
2、width 返回显示屏幕的宽度(按像素)
3、availHeight 返回显示屏幕可用高度(去掉 windows 任务栏)
4、availWidth 返回显示屏幕可用宽度

document.getElementById(“but1”).onclick = test; // 在走这句的时候才去生成这个点击的事件

绑定事件,解绑事件

document.getElementById(“but1”).attachEvent(“onclick”,test); // 绑定事件
function test() {
window.alert(‘你投了一次票’);
// 接触事件的绑定
document.getElementById(“but1”).detachEvent(‘onclick’,test); // 解绑点击事件
}

// onkeypress 事件
function test(event) {
// 用户每按下一个键,就去判断是不是一个数
if (event.keyCode<48 || event.keyCode>57) {
window.alert(“你输入的不是数”);
window.event.returnValue = false;
}
}

1、write() 向文档写文本或 HTML 表达式或 JavaScript 代码
2、writeln() 等同于 write() 方法,不同的是在每个表达式之后写一个换行符
3、open() 打开一个新文档,并删除当前文档内容
4、close() 关闭 open() 文档流
5、getElementById() 通过 html 控件的 id 得到 该控件。如果有相同的id则只取第一个
6、getElementsByName() 通过 html 的名字返回对象集合
7、getElementsByTagName() 通过 html 的标签名返回对象集合
8、createElement() 创建一个指定标签名的元素【比如:动态创建超链接】

文章转载于:https://www.jianshu.com/p/a10764f45921

原著是一个有趣的人,若有侵权,请通知删除

未经允许不得转载:起风网 » HTML 学习笔记 May 15,2017 dom编程开山篇、dom编程实例(乌龟抓鸡)、bom介绍.dom对象层次图.dom对象(window对象①)、dom对象(window对象②)
分享到: 生成海报

评论 抢沙发

评论前必须登录!

立即登录