1.BOM学习

1.bom.html

<html>
	<head>
		<title>bom演示</title>
		<script type="text/javascript" src="js/bom.js"></script>
	</head>
	<body>
		<div id = ‘d1‘>第一个div</div>
		<div id = ‘d2‘>第二个div</div>
		<a href="javascript:test();">测试</a></br>
		<a href="javascript:testTimeout();">测试setTimeout</a></br>
		<a href="javascript:testSetInterval();">测试setInterval</a></br>
		<a href="javascript:stopInterval();">停止Interval</a></br>
		<a href="javascript:alert(document.links.length);">多少个link?</a></br>
		<a href="javascript:alert(document.links[0]);">第一个link的地址</a></br>

		<a href="javascript:changeHtml();">改变第一个div的内容为“基本上为主”</a></br>

	</body>
</html>

  

2.child.html

<html>
	<head>
		<title>子窗口</title>
		<script type="text/javascript" src="js/bom.js"></script>
	</head>
	<body>
		<a href="javascript:alert(window.opener.msg);">子窗口访问父窗口的变量</a>
	</body>
</html>

  

3.bom.js

//alert(window);
//alert(window.document);
//alert(window.document.links);
//alert(window.document.anchors);
//alert(window.document.forms);
//alert(window.document.location);

function test(){

	//恶搞
	/*
	while(1 > 0){
		window.moveTo(Math.random()*1000, Math.random()*100);
		//window.moveBy(400, 600);
	}
	*/

	//alert(window.screenX);

	//alert(window.self);

	//window.open(‘child.html‘, ‘topFrame‘);

	var kti = 99888;
	alert(window.kti);
}

window.msg = ‘父窗口变量‘;

//测试setTimeout
function sayHello(){
	alert(‘hello!‘);
	//return function(){alert(‘hello!‘)};
}

function testTimeout(){
	window.setTimeout(sayHello, 2000);
	//window.setTimeout(sayHello(), 2000);
}

//测试setInterval
var t;
function testSetInterval(){
	t = window.setInterval(sayHello, 1000);
}

function stopInterval(){
	window.clearInterval(t);
}

//改变html内容
function changeHtml(){
	var k = document.getElementById(‘d1‘);
	alert(k);
	k.innerHTML = ‘基本上为主‘;
}

  

时间: 2024-10-04 11:58:49

1.BOM学习的相关文章

JS加强学习-BOM学习02

BOM的更多的用于特效方面的展示,接下来的学习就是将许多以前用到的知识与现在的结合后做出各种不同的动态效果来. 所以在这部分学习中涉及到的新知识会比较零散,甚至会将以前的知识部分衔接起来. 1. offsetParent 获取当前元素最近的设置了定位的父元素,如果没有父元素定位则选择的是body元素. 这样就可以容易理解offsetLeft的意义了,它是相对于offsetParent的距离. 2. offsetHeight 获取盒子的大小(border + height + padding):只

JS加强学习-BOM学习05

1. 正则表达式 我们学习正则表达式主要的是学习它的规则(语法),还有就是学习正则表达式在JS中的对象RegExp的属性和方法. 1.1 正则表达式定义: 它是用来操作字符串的一种逻辑公式,具体就是用事先定义好的一些特定字符.及这些特定字符的组合,组成一个“特定字符串的规则”,用这个“规则”来对字符串进行一种过滤和选择. 1.2 正则表达式的特点: 1.2.1 具有非常强的灵活性.逻辑性和功能性 1.2.2 可以用极简单的方式迅速地达到对字符串的复杂控制. 1.2.3 由于能满足各种情况的组合,

轻松学习JavaScript十七:JavaScript的BOM学习(二)

JavaScript计时事件 通过使用JavaScript中的BOM对象中的window对象的两个方法就是setTimeout()方法和claerTimeout()方法,我们 有能力作到在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行.我们称之为计时事件. 在JavaScritp中使用计时事件是很容易的,两个关键方法是: setTimeout()//未来的某时执行代码. clearTimeout()//取消setTimeout(). (1)setTimeout()方法 语法 va

JS加强学习-BOM学习04

今天主要是将事件的阶段详细讲一下,还有一些是属于事件对象的常用属性和方法. 1. 注册事件和移除事件 注册事件: addEventListener() attachEvent() 移除事件: removeEventListener() detachEvent() 注意: 需要将元素的事件移除时,需要注意移除事件的执行函数要与注册事件时的执行函数为同一个,如果注册时事件执行函数为一个匿名函数时,就算移除事件时的匿名函数内容一致也无法将事件移除,因为匿名函数每一个都是定义的新的函数,不是唯一.所有注

JS加强学习-BOM学习01

BOM   浏览器对象模型 1. 定时器 1.1 设置定时器: setTimeout(string/function,delay);间隔一定时间后执行一次,且只执行一次. setInterval(string/function,delay);每间隔一定时间后执行一次,一直执行下去. 这两个定时器的返回值是数字类型的定时器ID. 1.2 清除定时器: clearTimeout(定时器Id): clearInterval(定时器Id). 设置定时器和清除定时器需对应设置,不建议使用与设置定时器不一致

BOM学习

所谓的BOM即浏览器对象模型(Browser Object Model).BOM赋予了JS操作浏览器的能力,即window操作.DOM则用于创建删除节点,操作HTML文档.BOM尚无正式的标准,导致各浏览器对于BOM方法的支持各有不同,因此需要具体问题具体对待. 1.BOM简介. 所谓的BOM即浏览器对象模型(Browser Object Model).BOM赋予了JS操作浏览器的能力,即window操作.DOM则用于创建删除节点,操作HTML文档.BOM尚无正式的标准,导致各浏览器对于BOM方

js中BOM学习

BOM也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能.BOM缺少规范,每个浏览器提供商又按照自己想法去扩展它,那么浏览器共有对象就成了事实的标准.所以,BOM本身是没有标准的或者还没有哪个组织去标准它.   一.window对象 BOM的核心对象是window,它表示浏览器的一个实例.window对象处于JavaScript结构的最顶层,对于每个打开的窗口,系统都会自动为其定义 window 对象. 1.对象的属性和方法 window对象有一系列的属性,这些属性本身也是对象. win

轻松学习JavaScript十六:JavaScript的BOM学习(一)

一window对象概述 BOM的核心对象是Window对象,它表示浏览器的一个实例.window对象处于JavaScript结构的最顶层,对于每 个打开的窗口,系统都会自动为其创建window对象.所有浏览器都支持window对象,它表示浏览器窗口.所有 JavaScript全局对象.函数以及变量均自动成为 window对象的成员.全局变量是 window对象的属性.全局函数是 window对象的方法.甚至HTML DOM的document也是window 对象的属性之一.通过下面的两句代码我们

BOM学习2

一,弹出窗口: 1,window.open(url,target,status,b) url: 要跳转的链接: target:_self,_parent,_top和_blank四个参数,只有_blank是新开窗口: status:  新开窗口的大小,位置等等信息; b:布尔值,是否取代浏览器页面当前页面的url记录,只在不新开页面的情况下有效. ,2,浏览器的安全措施: 由于一些广告商简单粗暴的过度使用该window.open()方法来弹出广告,迫使各大浏览器都对该方法做出了安全限制,在现代的浏