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)

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

相关推荐
fouryears_234171 小时前
Flutter InheritedWidget 详解:从生命周期到数据流动的完整解析
开发语言·flutter·客户端·dart
我好喜欢你~1 小时前
C#---StopWatch类
开发语言·c#
加班是不可能的,除非双倍日工资3 小时前
css预编译器实现星空背景图
前端·css·vue3
lifallen3 小时前
Java Stream sort算子实现:SortedOps
java·开发语言
IT毕设实战小研3 小时前
基于Spring Boot 4s店车辆管理系统 租车管理系统 停车位管理系统 智慧车辆管理系统
java·开发语言·spring boot·后端·spring·毕业设计·课程设计
wyiyiyi3 小时前
【Web后端】Django、flask及其场景——以构建系统原型为例
前端·数据库·后端·python·django·flask
gnip4 小时前
vite和webpack打包结构控制
前端·javascript
excel4 小时前
在二维 Canvas 中模拟三角形绕 X、Y 轴旋转
前端
cui__OaO4 小时前
Linux软件编程--线程
linux·开发语言·线程·互斥锁·死锁·信号量·嵌入式学习
阿华的代码王国4 小时前
【Android】RecyclerView复用CheckBox的异常状态
android·xml·java·前端·后端