javascript对象的相关操作小结


Posted in Javascript onMay 16, 2016

我们知道浏览器对象模型(BOM)是javascript的组成之一,它提供了独立于内容与浏览器窗口进行交互的对象。其分层结构如下:

javascript对象的相关操作小结

window对象是整个BOM的核心其有document(文档对象)、location(地址对象) 和history(历史对象组成)

调用对象属性的语法:

1.对象.属性名=“属性值”;
2.对象[“属性名称字符串”]=”属性值”;

调用对象方法的语法:

1.对象的方法名();
2.对象[“方法名称字符串”]();

window对象的常用方法

window对象的常用方法

名 称 说 明
prompt() 显示可提示用户输入的对话框
alert() 显示一个大有提示信息和一个“确定“按钮的警示对话框
confirm() 显示一个大有提示信息、”确定“和”取消“按钮的对话框
close() 关闭浏览器窗口
open() 打开一个新的浏览器窗口加载给定URL所指定的文档
setTimeout() 在指定毫秒数后调用函数或计算表达式
setInterval() 按照指定的周期(以毫秒记)来调用函数或计算表达式

窗口的特征属性

名 称 说 明
height、width 高度、宽度(以像素记)
left、top 窗口的x和y坐标 以像素记
toolbar 是否显示浏览器的工具栏
scrollbars 是否显示滚动条
location 是否显示地址栏
status 是否添加状态栏
menubar 是否显示菜单栏
resizable 窗口是否可调节尺寸
titlebar 是否显示标题栏
fullscreen 是否使用全屏模式显示浏览器

window对象的常用事件

名 称 说 明
onload 一个页面或一幅图像加载完成
onmouseover 鼠标指针移到某元素之上
onclick 鼠标单击某个对象
onkeydown 某个键盘按键被按下
onchange 域的内容被改变

自定义对象的声明

第一种声明方式:

<script type="text/javascript">
  function paly() {
   var p = new Object();//创建一个Object对象开辟内存空间
   //给对象p定义属性
   p.age = 1;
   p.name = "javascript";
   //给对象p定义方法
   p.sayHi = function () {
    document.write("大家好!我是" + p.name + "我今年" + p.age + "岁了");
   }
   //返回对象p
   return p;
  }
  //创建自定义对象的实例
  var js = paly();
  //调用对象的方法
  js.sayHi();
  //调用对象的属性
  document.write(js.name);
 </script>

效果截图:

javascript对象的相关操作小结

第二中方式:

<script type="text/javascript">
  function paly() {
   
   //给对象定义属性
   this.age = 1;
   this.name = "javascript";
   //给对象定义方法
   this.sayHi = function () {
    document.write("大家好!我是" + this.name + "我今年" + this.age + "岁了");
   }
   
  }
  //创建自定义对象的实例
  var js = new paly();
  //调用对象的方法
  js.sayHi();
  //调用对象的属性
  document.write(js.name);
 </script>

效果截图:

javascript对象的相关操作小结

对象属性的遍历

<script type="text/javascript">
  function paly() {
   
   //给对象定义属性
   this.age = 1;
   this.name = "javascript";
   //给对象定义方法
   this.sayHi = function () {
    document.write("大家好!我是" + this.name + "我今年" + this.age + "岁了");
   }
   
  }
  //创建自定义对象的实例
  var js = new paly();
  //遍历对象的属性
  for (var par in js) {
   document.write("js."+par+"="+js[par]);
  }
 </script>

效果截图:

javascript对象的相关操作小结

with结构快

<script type="text/javascript">
  function paly() {
   
   //给对象定义属性
   this.age = 1;
   this.name = "javascript";
   //给对象定义方法
   this.sayHi = function () {
    document.write("大家好!我是" + this.name + "我今年" + this.age + "岁了");
   }
   
  }
  //创建自定义对象的实例
  var js = new paly();
  //with结构块中的方法或属性如不指定对象则默认为括号中(js)对象的属性或方法
  with (js) {
   sayHi();
   document.write("<br/>"+age);
  }
 </script>

效果截图:

javascript对象的相关操作小结

以上这篇javascript对象的相关操作小结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript XML和string相互转化实现代码
Jul 04 Javascript
jquery队列函数用法实例
Dec 16 Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
Aug 10 Javascript
jQuery+css实现的时钟效果(兼容各浏览器)
Jan 27 Javascript
javascript实现抽奖程序的简单实例
Jun 07 Javascript
js改变透明度实现轮播图的算法
Aug 24 Javascript
JavaScript实现瀑布流以及加载效果
Feb 11 Javascript
JS实现的数组去除重复数据算法小结
Nov 17 Javascript
浅谈Node.js 中间件模式
Jun 12 Javascript
ES6 系列之 Generator 的自动执行的方法示例
Oct 19 Javascript
详解JavaScript中的函数、对象
Apr 01 Javascript
js和jquery判断数据类型的4种方法总结
Aug 28 jQuery
WEB前端开发框架Bootstrap3 VS Foundation5
May 16 #Javascript
jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)
May 16 #Javascript
bootstrap布局中input输入框右侧图标点击功能
May 16 #Javascript
Bootstrap所支持的表单控件实例详解
May 16 #Javascript
移动端横屏的JS代码(beta)
May 16 #Javascript
js实现带农历和八字等信息的日历特效
May 16 #Javascript
jQuery 常用代码集锦(必看篇)
May 16 #Javascript
You might like
Admin generator, filters and I18n
2011/10/06 PHP
PHP借助phpmailer发送邮件
2015/05/11 PHP
file控件选择上传文件确定后触发的js事件是哪个
2014/03/17 Javascript
javascript实现添加附件功能的方法
2015/11/18 Javascript
JavaScript时间操作之年月日星期级联操作
2016/01/15 Javascript
js插件dropload上拉下滑加载数据实例解析
2016/07/27 Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
2017/04/26 Javascript
Vue2.0利用vue-resource上传文件到七牛的实例代码
2017/07/28 Javascript
详解webpack多页面配置记录
2018/01/22 Javascript
jQuery实现的简单对话框拖动功能示例
2018/06/05 jQuery
Vue中使用webpack别名的方法实例详解
2018/06/19 Javascript
layerui代码控制tab选项卡,添加,关闭的实例
2019/09/04 Javascript
layui select 禁止点击的实现方法
2019/09/05 Javascript
Python实现获取某天是某个月中的第几周
2015/02/11 Python
简洁的十分钟Python入门教程
2015/04/03 Python
读取本地json文件,解析json(实例讲解)
2017/12/06 Python
python去除文件中重复的行实例
2018/06/29 Python
python使用 cx_Oracle 模块进行查询操作示例
2019/11/28 Python
python将数组n等分的实例
2019/12/02 Python
Python SMTP配置参数并发送邮件
2020/06/16 Python
keras的load_model实现加载含有参数的自定义模型
2020/06/22 Python
Python调用百度OCR实现图片文字识别的示例代码
2020/07/17 Python
北美领先的牛仔品牌:Buffalo David Bitton
2017/05/22 全球购物
类和结构的区别
2012/08/15 面试题
函授本科自我鉴定
2013/11/03 职场文书
酒店人事专员岗位职责
2013/12/19 职场文书
机械个人求职信范文
2014/01/24 职场文书
关于是否需要写商业计划书
2014/02/07 职场文书
机关办公室岗位职责
2014/04/16 职场文书
计算机系本科生求职信
2014/05/31 职场文书
体育专业求职信
2014/07/16 职场文书
大专护理专业自荐信
2015/03/25 职场文书
活动宣传稿范文
2015/07/23 职场文书
Python基础之教你怎么在M1系统上使用pandas
2021/05/08 Python
MySQL不使用order by实现排名的三种思路总结
2021/06/02 MySQL
javascript代码简写的几种常用方式汇总
2021/08/23 Javascript