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

最新推荐文章于 2023-04-06 01:47:45 发布

IluckySi

最新推荐文章于 2023-04-06 01:47:45 发布

阅读量1k

点赞数

分类专栏： ------javascript 文章标签： javascript 语法内置对象 window

本文链接：https://blog.csdn.net/sidongxue2/article/details/23882193

版权

------javascript 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

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="删除" οnclick="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" οnclick="javascript:alert(this.src)">
  <form name="form">
   <input type="text" name="uername" value="ThisTest" οnclick="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" οnclick="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="转向" οnclick="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="转向" οnclick="javascript:goBack()">
  </form>
 </body>
  </html>

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

IluckySi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript基础学习-内置对象(四)

javascript语法由三部分组成:ECMAScript,DOM(文档对象模型)和BOM(浏览器对象模型).1.js弹出框. a.alert提示框. AlertTest alert("AlertTest"); 结果弹出窗口AlertTest. b.prompt输入框. Prompt
复制链接

扫一扫