1、DOM的基本概念

DOM是文档对象模型,这种模型为树模型;文档是指标签文档;对象是指文档中每个元素;模型是指抽象化的东西。

2、Window对象操作

一、属性和方法

属性(值或者子对象):

opener:打开当前窗口的源窗口,如果当前窗口是首次启动浏览器打开的,则opener是null。

dialogArgument:对话框返回值。

子对象:history,location,document,status,menubar,toolbar等。

方法(函数):事件(事先设置好的程序,被触发)。

二、Window.open"第一部分""第二部分""第三部分""第四部分"

Window.open的特征参数:

第一部分:写页面地址。

第二部分:_blank 打开的方式,在新窗口还是自身的窗口。

第三部分:控制打开的窗口格式,可以写多个,用空格隔开如下:

toolbar=no新打开的窗口无工具条 ;

menubar=no无菜单栏 status=no无状态栏 ;

width=100 height=100 宽度高度;

left=100 打开的窗口距离左边多少距离;

resizable=no窗口大小不可调 ;

scrollbars=yes 出现滚动条;

location=yes 有地址栏;

Window.open也有返回值,它的返回值是:新打开的窗口对象。

例如:

最简单的打开窗口:window.open("Untitled-6.html");

打开一个窗口并保存在变量中:var w= window.open();

可以将打开的多个窗口保存在数组w里:

function openW()

{

w[i++]=window.open();

}

三、window.close():关闭当前窗口;

w.close():关闭保存在变量w中的那个窗口;

关闭多个子窗口:先将打开的窗口存入数组内,利用循环将其挨个关闭;

关闭打开当前窗口的源窗口: window.opener.close();

四、间隔与延迟

间隔执行一段代码(函数):window.setInterval("要执行的代码",间隔的毫秒数)

清除间隔执行:window.clearInterval(间隔的id); 循环一次之后用来清除隔执行的代码

延迟一段时间执行某一段代码(函数):window.setTimeout("要执行的代码",延迟的毫秒数)

清除延迟:window.clearTimeout(延迟的id);清除setTimeout

五、调整页面

window.navigate("url") 跳转至目标页面,在谷歌浏览器下有bug;

window.moveTo(x,y) 移动页面至某一位置,位置由x和y决定;

window.resizeTo(宽,高) 调整页面的宽度和高度;

window.scrollTo(x,y)滚动页面至哪里,y代表纵向滚动。

六、模态对话框和非模态对话框

模态对话框(Modal Dialogue Box),是指在用户想要对对话框以外的应用程序进行操作时,必须首先对该对话框进行响应。如单击【确定】或【取消】按钮等将该对话框关闭,它和非模态对话框都是永远置顶的,它们的区别在于当对话框打开时,是否允许用户进行其他对象的操作。

打开模态对话框:window.showModalDialog("url","向目标对话框传的值","窗口特征参数");

特征参数:用分号隔开,像素大小用px。dialogHeight,dialogWidth,center,等

打开非模态对话框:window.showModelessDialog("url","向目标对话框传的值","窗口特征参数")

var a = window.dialogArgument;可以用一个参数来获取模态或非模态对话框传递的值。

3、Window.history对象

window.history.back();页面进行后退;

window.history.forward();页面前进;

window.history.go(n); n如果是正数则代表前进n个页面,n如果是负数则代表后退n个页面,一般常用这一种。

4、Window.location对象

location地址栏

var s = window.location.href;获取当前页面的地址

window.location.href="http://www.baidu.com";修改页面地址,会跳转页面

window.location.hostname: 主机名,域名,网站名,可用变量接收

window.location.pathname: 路径名,可用变量接收

5、Window.status对象

status状态栏,可以给状态栏添加要显示的文字

window.status="要在状态栏显示的内容";设置状态栏文字

例如:

function s()
{
    window.status = "向前走 就这么走";
}

JavaScript的DOM操作(1)的更多相关文章

  1. 第一百一十六节,JavaScript,DOM操作样式

    JavaScript,DOM操作样式 一.操作样式 CSS作为(X)HTML的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的CSS能力.CSS的能力和DOM级别密切相关,所以我们有必要检 ...

  2. 第一百一十五节,JavaScript,DOM操作表格

    JavaScript,DOM操作表格 学习要点: 1.操作表格 DOM在操作生成HTML上,还是比较简明的.不过,由于浏览器总是存在兼容和陷阱,导致最终的操作就不是那么简单方便了.本章主要了解一下DO ...

  3. Python之路day13 web 前端(JavaScript,DOM操作)

    参考链接:http://www.cnblogs.com/wupeiqi/articles/5433893.html day13 1. CSS示例 2. JavaScript 3. DOM操作 上节内容 ...

  4. 网站开发综合技术 三 JavaScript的DOM操作

    第3部分 JavaScript的DOM操作 1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Windows对象操作 ...

  5. Javascript的DOM操作 - 你真的了解吗?

    摘要 想稍微系统的说说对于DOM的操作,把Javascript和jQuery常用操作DOM的内容归纳成思维导图方便阅读,同时加入性能上的一些问题. 前言 在前端开发的过程中,javascript极为重 ...

  6. (转)Javascript的DOM操作 - 性能优化

    转载:https://my.oschina.net/blogshi/blog/198910 摘要: 想稍微系统的说说对于DOM的操作,把Javascript和jQuery常用操作DOM的内容归纳成思维 ...

  7. JavaScript:DOM操作

    一.DOM基础DOM(Document Object Model)即文档对象模型,针对HTML和XML文档的API(应用程序接口).DOM描绘了一个层次化的节点树,运行开发人员添加.移除和修改页面的某 ...

  8. JavaScript之DOM操作,事件操作,节点操作

    1,DOM操作 1.1  概念 所谓DOM,全称Document Object Model 文档对象模型,DOM是W3C(World Wide Web Consortuum )标准,同时也定义了访问诸 ...

  9. JavaScript 的DOM操作详解

    内容概要 DOM之查找标签 基本查找 间接查找 节点操作 获取值操作 class操作 样式操作 事件 内置参数this 事件练习 内容详细 DOM操作 DOM(Document Object Mode ...

  10. HTML JavaScript的DOM操作

    1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Window对象操作 一.属性和方法: 属性(值或者子对象): op ...

随机推荐

  1. 如何使用CSS3画出一个叮当猫

    刚学习了这个案例,然后觉得比较好玩,就练习了一下.然后发现其实也不难,如果你经常使用PS或者Flash的话,应该就会知道画个叮当猫是很容易 的事,至少我是这么觉得.但是,用CSS3画出来确实是第一次接 ...

  2. JS焦点图 上下翻动 支持IE6

    <div class="slider"> <ul class="num" id="homePushName"> &l ...

  3. jquery二级目录选中当前页的样式

    <div class="navlist clear"> <span><a href="/M/Page_32.html" title ...

  4. 未能正确加载“Microsoft.VisualStudio.Implementation.EditorPackage”包

    未能正确加载“Microsoft.VisualStudio.Implementation.EditorPackage”包 未处理ImportCardinalityMismatchException 未 ...

  5. 使用虚拟机在ubuntu下搭建mongoDB开发环境和简单增删改查操作

    最近在折腾mongodb和nodejs,在imooc上找了一个mongodb的入门教程,跟着里面一步一步的走,下面记录下我操作的步骤和遇到的问题. 课程地址:http://www.imooc.com/ ...

  6. 【转】Spark快速入门指南

    尊重版权,原文:http://blog.csdn.net/macyang/article/details/7100523   - Spark是什么? Spark is a MapReduce-like ...

  7. ASP.NET MVC5学习笔记之Action参数模型绑定之模型元数据和元数据提供

    一. 元数据描述类型ModelMetadata 模型元数据是对Model的描述信息,在ASP.NET MVC框架中有非常重要的作用,在模型绑定,模型验证,模型呈现等许多地方都有它的身影.描述Model ...

  8. Ksoap2 获取webservice返回值的getResponse() 出现的问题

    今天写了一个判断记录重复的webservcie 返回布尔类型 // 判断序列号在数据库是否重复 public static boolean isSerialNumExist(String serial ...

  9. Mongodb初学习--安装、试用

    MongoDB是一个基于分布式文件存储的数据库.由C++语言编写.旨在为WEB应用提供可扩展的高性能数据存储解决方案. 在MongoDB中数据被分组存储在数据集中,被称为一个集合(Collection ...

  10. POJ——3984

    走迷宫问题,POJ上面的题 #include <stdio.h> #include <stdlib.h> #define SIZE 5 bool findpath = fals ...