javascript第二天

最新推荐文章于 2022-01-10 13:27:57 发布

MlSAKA

最新推荐文章于 2022-01-10 13:27:57 发布

阅读量249

点赞数

分类专栏： web相关文章标签： javascript 对象 java web html

本文链接：https://blog.csdn.net/weixin_38132536/article/details/73928909

版权

web相关专栏收录该内容

10 篇文章 0 订阅

订阅专栏

1.BOM编程：(Broswer Object Model)浏览器对象模型编程，将浏览器各个部分封装成不同的对象

2.window对象：

open()：在页面中打开一个窗口，参数一为打开页面，参数二为打开方式（本窗口或新建窗口）

参数三为打开窗口的大小（width，height）。

setInterval()：设置定时器(不限制执行次数)

setTimeout()：设置定时器(仅执行一次)，两个定时器中，参数一为执行的方法，参数二为延迟的时间

cleanInterval()，cleanTimeout()：清楚设置的定时器

alert()：提示框(用户只能点确定)

confirm()：确认提示框，用户点击确定返回true，点击取消返回false

prompt()：输入提示框，点击确定返回true，点击取消返回false

注：调用window方法时，window可以省略不写。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function op(){
	window.open("6.29.3.html","_blank","width=200px,height=100px");
	}
var intervalId;//要清除任务要先设置该任务的id
function settime(){
	intervalId=window.setInterval("alert('long may the sunshing')",3000);
	}
var timeoutId;//要清除任务要先设置该任务的id
function timcount(){
	timeoutId=window.setTimeout("op()",2000);
	}
function cleari(){
	window.clearInterval(intervalId);
	}
function cleart(){
	window.clearTimeout(timeoutId);
	}
</script>
</head>

<body>
<input type="button"  value="open" οnclick="op()"/>
<input type="button" value="settime" οnclick="settime()"/>
<input type="button" value="timecount"  οnclick="timcount()"/>
<input type="button" value="clear" οnclick="cleari()" />
<input type="button" value="cleartimeout" οnclick="cleart()" />
</body>
</html>

3.location对象：herf属性：代表地址栏的url，可以获取和设置该项

reload方法：刷新当前页面

4.history对象：forward()：前进道下一页

back()：退回到上一页

go()：跳转到某页，正数前进，负数后退

5.screen对象：availHeight和availWidth是排除了任务栏之后的高度和宽度，width和height是整个屏幕的像素值

6.事件编程：三要素：事件源，事件，监听器

点击相关的：
单击： onclick
双击： ondblclick

焦点相关的：（获得焦点输入框内提示内容消失，失去焦点显示内容）
聚焦： onfocus
失去焦点： onblur

选项相关的：（select选项改变，做一个籍贯选项）
改变选项： onchange

鼠标相关的：（画一个div区块进行演示）
鼠标经过： onmouseover
鼠标移除： onmouseout

页面加载相关的：（一般用在body标签中，用于网页加载完毕后还需执行什么操作进行触发）
页面加载： onload

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function Click(){
	alert("触发单击事件");
	}
function dbClick(){
	alert("双击事件触发");
	}
function onFocus(){//鼠标聚焦
	var user=document.getElementById("user");
	user.value="";
	}
function onBlur(){//鼠标移焦
	var user=document.getElementById("user");
	}
function onChange(){
	var com=document.getElementById("comp").value;
	var game=document.getElementById("game");
	game.innerHTML="<option>请选择</option>";
	if(com=="1"){
		game.innerHTML="<option>assassin'creed</option><option>for honner</option><option>watch dog</option>"
		}else if(com=="2"){
			game.innerHTML="<option>fifa</option><option>mirro's edge</option><option>need for speed</option>"
			}else if(com=="3"){
				game.innerHTML="<option>dark soul</option><option>bio</option><option>dmc</option>"
				}
	}
//给鼠标移入加一个监听
function testOut(){
	alert("移入");
	}
//鼠标移除的事件
function testOver(){
	alert("移出");
	} 
</script>
</head>

<body>
<input type="button" value="单击事件" οnclick="Click()" />
<input type="button" value="双击事件" οndblclick="dbClick()" />
<input  id="user" type="text" value="请输入用户名" οnfοcus="onFocus()" οnblur="onBlur()"/><br>
<select id="comp" οnchange="onChange()">
<option>请选择</option>
<option value="1">ubi</option>
<option value="2">ea</option>
<option value="3">capcom</option>
</select>
<select id="game"></select>
<div style="width:300px;height:200px;border:3px solid #00F" οnmοuseοver="testOver()" οnmοuseοut="testOut()">范围</div>
</body>
</html>

MlSAKA

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript第二天

1.BOM编程：(Broswer Object Model)浏览器对象模型编程，将浏览器各个部分封装成不同的对象2.window对象： open()：在页面中打开一个窗口，参数一为打开页面，参数二为打开方式（本窗口或新建窗口）参数三为打开窗口的大小（width，height）。 se
复制链接

扫一扫