javascript基础学习-内置对象(四)

来源：互联网发布：三维建筑房屋设计软件编辑：程序博客网时间：2024/05/22 12:12

javascript语法由三部分组成:ECMAScript,DOM(文档对象模型)和BOM(浏览器对象模型).

本篇博客简单介绍一下javascript中的内置对象.
1.js弹出框.
a.alert提示框.

  <html> <head>  <title>AlertTest</title>  <script language="javascript">   alert("AlertTest");  </script> </head>    </html>

结果弹出窗口AlertTest.
b.prompt输入框.

  <html> <head>  <title>PromptTest</title>  <script language="javascript">   var userName=prompt("请输入姓名");   document.write("你好:"+userName);  </script> </head>    </html>

结果弹出输入框,填入值后,在页面取到并做显示.
c.Confirm确认框.

     <html> <head>  <title>ConfirmTest</title>  <script language="javascript">   function confirmTest() {   if(confirm("确定要删除吗?"){    document.form.submit();    }  </script> </head> <body>  <form name="form" action="deleteSuccess.html" method="post">   <input type="button" value="删除" onclick="javascript:confirmTest()">  </form> </body>    </html>

结果弹出是否删除确认窗口.
2.this.

 <html> <head>  <title>ThisTest</title>  <script language="javascript">   function thisTest(obj) {    if(obj.value==""){     alert("空值!");     }else{     alert(obj.value);    }   }  </script> </head> <body>  <image src="ThisTest.jpg" onclick="javascript:alert(this.src)">  <form name="form">   <input type="text" name="uername" value="ThisTest" onclick="javascript:thisTest(this)">  </form> </body>  </html>

结果略.
3.for in遍历对象.

<html> <head>  <title>ForInTest</title>  <script language="javascript">   var array=new Array("a","b","c");   for(i in array){    document.write(i+":"+array[i] +"<br>");   }  </script> </head>  </html>

结果页面显示0:a 1:b 2:c.
4.with建立一个默认的对象.

   <html> <head>  <title>WithTest</title>  <script language="javascript">   with(document){    write("WithTest1");    write("WithTest2");    write("WithTest3");    write("WithTest4");   }  </script> </head>  </html>

结果页面显示WithTest1WithTest2WithTest3WithTest4.
5.new.

 <html> <head>  <title>NewTest</title>  <script language="javascript">   var date=new Date();   alert(date.getDate());  </script> </head>  </html>

结果页面显示当前日期的日子的号码(1-31).
6.window当前浏览器窗口.
a.状态窗口.

   <html> <head>  <title>WindowTest1</title>  <script language="javascript">   windows.status="WindowsTest";  </script> </head> <body>  <form name="form">   <input type="button" value="window" onMouseOver="javascript:windows.status='change'">  </form> </body>    </html>

结果页面的状态窗口显示WindowTest,当鼠标挪到鼠标时,状态窗口显示change.
b.window.open弹出新窗口.

    <html> <head>  <title>WindowTest2</title>  <script language="javascript">   window.open("Window.html","windowname","toolbar=no,left=200,top=200,menubar=no,width=100;height=100,resizable=no");  </script> </head> </html>

结果弹出一个子窗口,各种属性如上.
c.window.close窗口的深入使用.

 <html> <head>  <title>WindowTest3</title>  <script language="javascript">   var win=window.open("Window.html","windowname","toolbar=no,left=200,top=200,menubar=no,width=100;height=100,resizable=no");  </script> </head> <body>  <form name="form">   <input type="button" onclick="javascript:win.close();" value="关闭窗口">  </form> </body>    </html>

结果页面弹出一个窗口,并且主页面有一个关闭按钮,点击关闭按钮,子页面被关闭.
7. winodw.loaction地址栏内容.

 <html> <head>  <title>WindowLoactionTest</title>  <script language="javascript">   alert(window.location);  </script> </head>  </html>

结果页面显示当前页面的url.
8.转向指定页面.

 <html> <head>  <title>WindowLoactionTest2</title>  <script language="javascript">   function go(){    window.location="WindowLoactionTest2.html";   }  </script> </head> <body>  <form name="form">   <input type="button" value="转向" onclick="javascript:go()">  </form> </body>  </html>

9.页面返回.

  <html> <head>  <title>WindowLoactionTest3</title>  <script language="javascript">   function goBack(){    history.back();   }  </script> </head> <body>  转向成功！  <form name="form">   <input type="button" value="转向" onclick="javascript:goBack()">  </form> </body>  </html>

注意:如果想要IE支持调试js bug,需要对IE做一下特殊配置:IE:工具-Internet选项-高级-打开禁用脚本调试.

0 0