JavaScript DOM2

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="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="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="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="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>