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精华代码集
Jan 24 Javascript
window.location.hash 属性使用说明
Mar 20 Javascript
ANT 压缩(去掉空格/注释)JS文件可提高js运行速度
Apr 15 Javascript
JS代码同步文本框内容的实例方法
Jul 12 Javascript
利用jQuery实现可以编辑的表格
May 26 Javascript
js 数组去重的四种实用方法
Sep 09 Javascript
js实现带圆角的两级导航菜单效果代码
Aug 24 Javascript
深入研究jQuery图片懒加载 lazyload.js使用方法
Aug 16 jQuery
Angular5中调用第三方js插件的方法
Feb 26 Javascript
Vue 页面跳转不用router-link的实现代码
Apr 12 Javascript
解决Vue中mounted钩子函数获取节点高度出错问题
May 18 Javascript
js、jquery实现列表模糊搜索功能过程解析
Mar 27 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
晶体管来复再生式二管收音机
2021/03/02 无线电
php 数组的一个悲剧?
2011/05/11 PHP
PHP连接MongoDB示例代码
2012/09/06 PHP
深入PHP autoload机制的详解
2013/06/09 PHP
Yii2学习笔记之汉化yii设置表单的描述(属性标签attributeLabels)
2017/02/07 PHP
JavaScript网页制作特殊效果用随机数
2007/05/22 Javascript
基于jquery的固定表头和列头的代码
2012/05/03 Javascript
关于query Javascript CSS Selector engine
2013/04/12 Javascript
JavaScript实现点击自动选择TextArea文本的方法
2015/07/02 Javascript
Javascript OOP之面向对象
2016/07/31 Javascript
总结十个Angular.js由浅入深的面试问题
2016/08/26 Javascript
JS遍历ul下的li点击弹出li的索引的实现方法
2016/09/19 Javascript
Javascript动画效果(2)
2016/10/11 Javascript
深入探究node之Transform
2017/07/20 Javascript
带你了解session和cookie作用原理区别和用法
2017/08/14 Javascript
js中this对象用法分析
2018/01/05 Javascript
vue中使用ueditor富文本编辑器
2018/02/08 Javascript
详解使用create-react-app添加css modules、sasss和antd
2018/07/31 Javascript
使用Element的InfiniteScroll 无限滚动组件报错的解决
2020/07/27 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
2020/09/02 Javascript
跟老齐学Python之大话题小函数(2)
2014/10/10 Python
利用 Monkey 命令操作屏幕快速滑动
2016/12/07 Python
使用Django和Python创建Json response的方法
2018/03/26 Python
pandas 把数据写入txt文件每行固定写入一定数量的值方法
2018/12/28 Python
Python中pymysql 模块的使用详解
2019/08/12 Python
python统计指定目录内文件的代码行数
2019/09/19 Python
Selenium 安装和简单使用的实现
2020/12/04 Python
酒店办公室文员岗位职责
2013/12/18 职场文书
承诺书格式范文
2014/06/03 职场文书
小学教师读书活动总结
2014/07/08 职场文书
支部书记四风问题自我剖析材料
2014/09/29 职场文书
2015年安全生产月活动总结
2015/03/26 职场文书
2016七夕情人节寄语
2015/12/04 职场文书
Mysql8.0递归查询的简单用法示例
2021/08/04 MySQL
美元符号 $
2022/02/17 杂记
5人制售《绝地求生》游戏外挂获利500多万元 被判刑
2022/03/31 其他游戏