1、Window.history:window.open打开网页的方式必须是_self

window.history.back()后退

Window.history.forward()前进

<body>
<input type="button" value="打开窗口" onclick="Dk()" />
<input type="button" value="前进" onclick="Qian()" />
</body>
<script type="text/javascript">
function Dk()
{
window.open("Untitled-2.html","_self","width=300 height=300");
} function Qian()
{
window.history.forward();
}

Window.history.go(n);n为正数就是前进几个页面,为负数就是后退几个页面。

<body>
<input type="button" value="打开窗口" onclick="Dk()" />
<input type="button" value="前进" onclick="Qian()" />
</body>
<script type="text/javascript">
function Dk()
{
window.open("Untitled-2.html","_self","width=300 height=300");
} function Qian()
{
window.history.go(1);
}

2、window.document

查找元素

根据id查找    var  d1 = document.getElementById("d1");

根据class查找  var d2 = document.getElementsByClassName("d2");找到的是数组

.根据标签名找  var d3 = document.getElementsByTagName("div");找到的是数组

表单元素  var d4 = document.getElementsByName("aa") 找到的是数组

3、操作
        1.操作内容 var d1 = document.getElementById("d1");

获取内容

alert(d1.innerText);
        alert(d1.innerHTML);
        修改内容
        d1.innerHTML = "<b>修改</b>";

    <body>
<div id="d1" style="width:100px; height:100px;">你好</div>
</body>
<script type="text/javascript">
var b=document.getElementById("d1")
b.innerHTML="<b>修改</b>"
</script>

d1.innerText = "修改";

    <body>
<div id="d1" style="width:100px; height:100px;">你好</div>
</body>
<script type="text/javascript">
var b=document.getElementById("d1")
b.innerText="修改"
</script>
   

2.操作属性
        var d1 = document.getElementById("d1");
       获取属性
        alert(d1.getAttribute("width"));
        设置属性
        d1.setAttribute("width","200");
        移除属性
        d1.removeAttribute("width");

    <body>
<input type="button" value="按钮" disabled="disabled" id="d1"/>
</body>
<script type="text/javascript">
var b=document.getElementById("d1") </script>

    <body>
<input type="button" value="按钮" disabled="disabled" id="d1"/>
</body>
<script type="text/javascript">
var b=document.getElementById("d1")
b.removeAttribute("disabled")
</script>

3.操作样式
        var d1 = document.getElementById("d1");
        获取样式(只能获取内联,内嵌和外部都不能获取)
        alert(d1.style.color);
       alert(d1.style.backgroundColor);
        修改样式
        d1.style.backgroundColor = "";

    <body>
<div id="d1" style="width:100px; height:100px; background-color:#0F0">你好</div>
</body>
<script type="text/javascript">
var b=document.getElementById("d1")
b.innerHTML="<b>修改</b>"

    <body>
<div id="d1" style="width:100px; height:100px; background-color:#0F0">你好</div>
</body>
<script type="text/javascript">
var b=document.getElementById("d1")
b.innerHTML="<b>修改</b>"
b.style.width="200px"
</script>

JavaScript DOM2的更多相关文章

  1. 26 JavaScript HTML DOM简介&方法&文档

    HTML DOM: Document  Object  Model 文档对象模型.是HTML的标准对象模型和编程接口.(JavaScript只是可以操作HTML DOM的语言之一) 定义了HTML元素 ...

  2. JavaScript DOM高级程序设计 3.-DOM2和HTML2--我要坚持到底!

    由一个HTML进行说明,我就不敲了,直接copy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " ...

  3. Javascript事件模型(一):DOM0事件和DOM2事件

    javascript事件模型,本文主要有以下内容: DOM0事件模型 DOM2事件模型  一.DOM0事件模型 早期的事件模型称为DOM0级别. DOM0的事件具有极好的跨浏览器优势, 会以最快的速度 ...

  4. 《JavaScript高级程序设计》笔记:DOM2和DOM3(十二)

    DOM1级主要定义的是HTML和XML文档的底层结构.DOM2级和DOM3级在这个结构基础上引入了更多的交互能力,也支持更高级的XML特性.为此DOM2级和DOM3级分为了很多的模块(模块直接具有某种 ...

  5. JavaScript 之默认行为 DOM2级,事件委托机制

    1. 事件默认行为及阻止方式    1.1 浏览器的默认行为       JavaScript事件本身所具有的属性,例如a标签的跳转,Submit按钮的提交,右键菜单,文本框的输入等.    1.2 ...

  6. javascript中DOM0,DOM2,DOM3级事件模型解析

    DOM 即 文档对象模型. 文档对象模型是一种与编程语言及平台无关的API(Application programming Interface),借助于它,程序能够动态地访问和修改文档内容.结构或显示 ...

  7. JavaScript 【非IE DOM2级XML】

    DOM2中的XML IE可以实现了对XML字符串或XML文件的读取,其他浏览器也各自实现了对XML处理功能.DOM2级在document.implementaion中引入了createDocument ...

  8. javascript高级程序设计第3版——第12章 DOM2与DOM3

    12章——DOM2与DOM3 为了增强D0M1,DOM级规范定义了一些模块. DOM2核心:为不同的DOM类型引入了一些与XML命名空间有关的方法,还定义了以编程方式创建Document实例的方法: ...

  9. Javascript高级编程学习笔记(54)—— DOM2和DOM3(6)范围选择

    范围 为了让开发人员更加方便地控制页面“DOM2级遍历和范围”模块定义了“范围”接口 通过该接口开发人员可以选择文档中的一个区域,而不必考虑元素的界限 在常规操作不能有效地修改文档时,使用范围往往可以 ...

随机推荐

  1. LeetCode 41 First Missing Positive(找到数组中第一个丢失的正数)

    题目链接: https://leetcode.com/problems/first-missing-positive/?tab=Description   给出一个未排序的数组,求出第一个丢失的正数. ...

  2. CF 217A Ice Skating

    A. Ice Skating time limit per test 2 seconds memory limit per test 256 megabytes input standard inpu ...

  3. DragonBones龙骨换装(局部换装+全局换装)

    参考: Egret官方换装动画 Egret换装三种方式 CSDN(全局换装) egret使用DragonBones实现简单的换装 换装,主要是替换任意插槽的图片,来达到局部换装的目的. 游戏中可以只制 ...

  4. 【题目】求n以内的素数个数

    最近在leetCode上刷提,还是满锻炼人的,为以后面试打基础吧.不多说下面开始. 问题:求[2,n]之间的素数的个数. 来源:leetCode OJ 提示: Let's start with a i ...

  5. 通过Intent Flags ,从桌面返回到App最后Activity

    extends:http://bbs.csdn.net/topics/350269396,http://blog.csdn.net/moreevan/article/details/6788048 最 ...

  6. Python 核心编程

    第3章 Python 基础 1.语句和语法: 注释(#): 继续换句话说跨行(\):有两种例外情况一个语句不使用反斜线也可以跨行.在使用闭合操作符时,单一语句可以跨多行,如小括号.中括号,花括号等,另 ...

  7. 8.11 数据库ORM(5)

    2018-8-11 20:43:52 昨天从俺弟家回来了. 和俺弟聊天发现,他一直停留在自己目前的圈子,自己觉得很牛逼,比别人高人一等,, 读书无用论,,可以用 幸存者偏激理论 大概就是这个 可以否决 ...

  8. TFS二次开发11——标签(Label)

    下图是在VS2010里创建Label的界面 可以看出创建Label 需要如下参数:Name.Comment.Path.Version .下面是代码实现: using Microsoft.TeamFou ...

  9. os.stat(filename).st_size 文件信息

    os.path.getsize(i) py36\Lib\genericpath.py def getsize(filename): """Return the size ...

  10. Linux计划任务Crontab学习笔记

    1  http://www.jb51.net/LINUXjishu/345698.html 2  http://www.jb51.net/LINUXjishu/345705.html 3  http: ...