javascript对象

目录

Array对象

属性:

length属性:数组中元素个数

方法:

push:添加

splice:删除

String对象

属性:

length:字符串长度

方法

trim():去除字符申前后两端的空白字符

自定义对象

BOM对象

Window

获取:

属性:

方法:

confirm:

setTimeout()

setInterval()


Array对象

JavaScript Array对象用于定义数组

定义:

方式一:

var 变量名=new Array(元素列表)

示例:

方式二:

var 变量名=[元素列表]

示例:

访问:

arr[索引]=值

这里的索引也是从0开始

JS数组类似于Java集合,长度,类型都可变

没有的数据用空字符表示

可以看到类型也是可以改变的


属性:

length属性:数组中元素个数


方法:

push:添加


splice:删除

表示从arr[0]开始删,删除一个元素


String对象

定义:

方式一:

var 变量名=new String(s) ;

方式二:

var 变量名=s;


属性:

length:字符串长度


方法

trim():去除字符申前后两端的空白字符

这样输出是有很多空格的

下面我们使用trim()方法


自定义对象

var 对象名称 ={

属性名称1:属性值1,

属性名称2:属性值2,

....

函数名称:function(形参列表){}

...

};


BOM对象

  • Browser Object Model 浏览器对象模型
  • Javascript 将浏览器的各个组成部分封装为对象

组成:

  • Window:浏览器窗口对象
  • Navigator:浏览器对象
  • Screen:屏幕对象
  • History:历史记录对象
  • Location:地址栏对象

Window

Window:浏览器窗口对象

获取:

直接使用 window,其中window.可以省略

复制代码
window.alert("abc"); 

属性:

获取其他 BOM对象

history 对 History 对象的只读引用。请参数 History 对象

Navigator 对 Navigator 对象的只读引用。请参数 Navigator 对象.

Screen 对 Screen 对象的只读引用。请参数 Screen 对象

location 用于窗口或框架的 Location 对象。请参阅 Location 对象。

方法:

alert() 显示带有一段消息和一个确认按钮的警告框。

confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。

setInterval() 按照指定的周期(以毫秒计 )来调用函数或计算表达式。

setTimeout() 在指定的毫秒数后调用函数或计算表达式。

confirm:

点击确定按钮。返回true。点击取消按钮,返回false

是会有返回值的,我们可以看看用户点击的是什么

点击确定后

点击取消后

setTimeout()

3秒钟之后弹出haha

setInterval()

两秒钟弹一次haha


History

History:历史记录

获取:

使用 window.history获取,其中window.可以省略

window.history.方法();

history.方法();

方法

back() 加载 history 列表中的前一个 URL

fonward() 加载 history 列表中的下一个 URL

Location

Location:地址栏对象

获取:

使用 window.location获取,其中window.可以省略

window.location.方法();

location.方法();

属性

href 设置或返回完整的 URL。

DOM对象

JavaScript 通过 DOM,就能够对 HTML进行操作了

  • 改 HTML 元素的内容
  • 改变 HTML元素的样式(CSS)
  • 对 HTML DOM 事件作出反应
  • 添加和删除 HTML 元素

获取Element

Element:元素对象

获取:使用Document对象的方法来获取

  1. getElementByld:根据id属性值获取,返回一个Element对象
  2. getElementsByTagName:根据标签名称获取,返回Element对象数组
  3. getElementsByName:根据name属性值获取,返回Element对象数组
  4. getElementsByClassName:根据class属性值获取,返回Element对象数组
html 复制代码
<body>

<img id="love" src="4c6468f4debfa0fbdf5b7826ceee663.jpg" width="500" height="500"><br>
<div class="cls">csdn</div>
<br>

<div class ="cls">努力敲代码的小火龙</div>
<br>
<input type="checkbox" name="hobby">电影
<input type="checkbox" name="hobby">旅游
<input type="checkbox" name="hobby">敲代码
<br>

getElementByld

getElementsByTagName

弹出两次

getElementsByName

弹出三次

getElementsByClassName

弹出两次

style:设置元素css样式

innerHTML:设置元素内容

剩下的大家可以查阅文档

JavaScript 参考手册 (w3school.com.cn)

感谢大家的观看,继续加油!!!

相关推荐
前端拾光者1 分钟前
利用D3.js实现数据可视化的简单示例
开发语言·javascript·信息可视化
程序猿阿伟3 分钟前
《C++ 实现区块链:区块时间戳的存储与验证机制解析》
开发语言·c++·区块链
Json_1817901448019 分钟前
电商拍立淘按图搜索API接口系列,文档说明参考
前端·数据库
傻啦嘿哟20 分钟前
如何使用 Python 开发一个简单的文本数据转换为 Excel 工具
开发语言·python·excel
大数据编程之光25 分钟前
Flink Standalone集群模式安装部署全攻略
java·大数据·开发语言·面试·flink
初九之潜龙勿用25 分钟前
C#校验画布签名图片是否为空白
开发语言·ui·c#·.net
风尚云网42 分钟前
风尚云网前端学习:一个简易前端新手友好的HTML5页面布局与样式设计
前端·css·学习·html·html5·风尚云网
Dola_Pan42 分钟前
C语言:数组转换指针的时机
c语言·开发语言·算法
ExiFengs42 分钟前
实际项目Java1.8流处理, Optional常见用法
java·开发语言·spring
paj12345678944 分钟前
JDK1.8新增特性
java·开发语言