函数: 四要素

1.返回类型
2.函数名
3.参数列表
4.函数体

window . 对象

  opener  打开当前窗口的源窗口  alert(window.opener);

  open( )     例子:

先给他设置一个按钮名。

window.open("第一部分","第二部分","第三部分","第四部分");

特征参数:

第一部分:写要打开的页面地址
第二部分:打开的方式,_blank 是在新窗口打开 _self
第三部分:控制打开的窗口,可以写多个,用空格隔开
toolbar=no新打开的窗口无工具条
menubar=no无菜单栏 status=no无状态栏
width=100 height=100 宽度高度
left=100 打开的窗口距离左边多少距离
resizable=no窗口大小不可调
scrollbars=yes 出现滚动条
location=yes 有地址栏

返回值:新打开的窗口对象

2:最简单的打开窗口
window.open("http://www.baidu.com","_blank","toolbar=no"); 在一个新窗口中打开百度。

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

4:只打开窗口一次,例子如下:

if(w==null)
{
w=window.open("http://www.baidu.com","_blank","toolbar=no");
}

这里用一个if语句,判断w的值是否为空,打开一个窗口之后w的值就不为空了,之后再点击鼠标调用此函数则不执行打开新窗口。

  close( )   关闭指定的窗口 
  setinteval( )    ("要执行的代码",间隔的毫秒数)
  setTimeout( )   ("要执行的代码",延迟的毫秒数)
  

  history

window.history对象

历史记录,通过历史记录可以操作页面前进或者后退

window.history.back();后退

window.history.forward();前进

window.history.go(n); n是正数代表前进n个页面,n是负数代表后退n个页面。

  location

location地址栏

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

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

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

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

  document . 对象

找元素:    第一方法:getElementById()根据ID找

alert(document.getElementById("ID名")); 根据ID找
根据class找。 返回数组,有几个标签名就出来数字是几。

   第二种方法: getElementsByClassName()根据class找,返回数组

var attr = document.getElementsByClassName("class名");
alert(attr[2]);

    第三种方法:getElementsByName()根据name找,返回数组

根据name找。 返回数组,有几个标签名就出来数字是几。
alert(document.getElementsByName("name名")[0]);

    第四种方法:getElementsByTagName()根据标签名找,返回数组

根据标签名找。 返回数组,有几个标签名就出来数字是几。
alert(document.getElementsByTagName("div").length);

操作内容:
  普通元素:

  innerText获取内容文本我们能够看到的操作内容:

普通元素:例子
var a = document.getElementById("a");
1.获取内容文本
alert(a.innerText);
2.设置内容
a.innerText = "ok"; 要把(ok)设置进去 (a)只是一个名称可以随便的

innerHTML获取标签里所有内容所有代码包括标签

例子:

3.获取内容代码

alert(a.innerHTML);
4.设置内容
a.innerHTML = "<span style='color:red'>ok</span>";

5.显示出标签
a.innerText = "<a href='#'>超链接</a>";

表单元素:
  value

操作属性:
  .setAttribute(属性名,属性值)设置属性
  .removeAttribute(属性名)移除属性
  .getAttribute(属性名)获取属性

操作样式:

a.style.width获取样式

例:::
操作样式
var a = document.getElementById("d");

1.获取样式,只能获取内嵌的
alert(a.style.width);

2.设置样式
a.style.fontSize = "30px";

3.修改样式
a.style.backgroundColor = "green";
a.style.color="white";

windows对象 document对象 的一些操作 9.23的更多相关文章

  1. BOM对象,math对象document对象的属性和操作和 事件的基本操作

    Math对象 //该对象中的属性方法 和数学有关. abs(x) 返回数的绝对值. exp(x) 返回 e 的指数. floor(x) 对数进行下舍入. log(x) 返回数的自然对数(底为e). m ...

  2. JavaScript对象(document对象 图片轮播)

    图片轮播: 需要注意的HTML需要img标签,他和input标签一样,是非封闭的标签 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...

  3. HTML中 DOM操作的Document 对象详解(收藏)

    Document 对象Document 对象代表整个HTML 文档,可用来访问页面中的所有元素.Document 对象是 Window 对象的一个部分,可通过 window.document 属性来访 ...

  4. 【使用 DOM】使用 Document 对象

    Document 对象时通往DOM功能的入口,它向你提供了当前文档的信息,以及一组可供探索.导航.搜索或操作结构与内容的功能. 我们通过全局变量document访问Document对象,它是浏览器为我 ...

  5. 【温故而知新-Javascript】使用 Document 对象

    Document 对象时通往DOM功能的入口,它向你提供了当前文档的信息,以及一组可供探索.导航.搜索或操作结构与内容的功能. 我们通过全局变量document访问Document对象,它是浏览器为我 ...

  6. dom对象详解--document对象(一)

     document对象 Document对象代表整个html文档,可用来访问页面中的所有元素,是最复杂的一个dom对象,可以说是学习好dom编程的关键所在. Document对象是window对象的一 ...

  7. 浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Document 对象

    ylbtech-浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Document 对象 1.返回顶部 1. HTML DOM Document 对象 Docume ...

  8. JS中的DOM对象及JS对document对像的操作

    DOM对象 windows:属性:opener(打开者) 方法:open().close(),setTimeout().setInterval()... location:属性:href 方法:rel ...

  9. JavaScript的DOM操作。Window.document对象

    间隔执行一段代码:window.setlnteval("需要执行的代码",间隔毫秒数) 例 :      window.setlnteval("alert("你 ...

随机推荐

  1. Android架构初探

    #一 背景点评美团合并之后,业务需要整合,我们部门的几条业务需要往美团平台迁移,为了降低迁移成本,开发和维护成本,以及将来可能要做的单元测试,需要对架构进行相应的调整.之前的代码都堆在Activity ...

  2. 微软BI 之SSIS 系列 - 通过 ROW_NUMBER 或 Script Component 为数据流输出添加行号的方法

    开篇介绍 上午在天善回答看到这个问题 - SSIS 导出数据文件,能否在第一列增加一个行号,很快就帮助解决了,方法就是在 SQL 查询的时候加一个 ROW_NUMBER() 就可以了. 后来想起在两年 ...

  3. 分区工具parted的详解及常用分区使用方法【转】

    来源:http://blog.51cto.com/zhangmingqian/1068779 分区工具parted的详解及常用分区使用方法 一.         parted的用途及说明 概括使用说明 ...

  4. Mysql INSERT、REPLACE、UPDATE的区别

    用于操作数据库的SQL一般分为两种,一种是查询语句,也就是我们所说的SELECT语句,另外一种就是更新语句,也叫做数据操作语句.言外之意,就是对数据进行修改.在标准的SQL中有3个语句,它们是INSE ...

  5. 单片机成长之路(51基础篇) - 017 C51中data,idata,xdata,pdata的区别(转)

    从数据存储类型来说,8051系列有片内.片外程序存储器,片内.片外数据存储器,片内程序存储器还分直接寻址区和间接寻址类型,分别对应code.data.xdata.idata以及根据51系列特点而设定的 ...

  6. Boinx FotoMagico for Mac(电子相册制作工具)破解版安装

    1.软件简介    FotoMagico 是 macOS 系统上一款非常好用的电子视频相册制作工具,FotoMagico 被誉为 Mac 上的「会声会影」,我们可以使用这款软件快速的制作出精美的音乐视 ...

  7. JS 遍历JSON中每个key值

    JS 遍历JSON中的每个key值,可以按键值对进行存储: var myVar = { typeA: { option1: "one", option2: "two&qu ...

  8. JS前台效果

    最新的在上面 2014年3月3日14:46:46 百分比思路 function fixWidth(percent) { return document.body.clientWidth * perce ...

  9. 12C新特性--Application Continuity

    Application Continuity特性可以在中断后恢复受影响的数据库会话的任务,从而让终端用户和应用程序感觉不到中断的发生.Application Continuity执行恢复的过程是在应用 ...

  10. WPF显示图片

    1.WPF显示图片内部一部分 <Rectangle Height="> <Rectangle.Fill > <ImageBrush ImageSource=&q ...