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 小时前
Python学习大纲总结及注意事项
开发语言·python·学习
待磨的钝刨1 小时前
【格式化查看JSON文件】coco的json文件内容都在一行如何按照json格式查看
开发语言·javascript·json
XiaoLeisj3 小时前
【JavaEE初阶 — 多线程】单例模式 & 指令重排序问题
java·开发语言·java-ee
励志成为嵌入式工程师4 小时前
c语言简单编程练习9
c语言·开发语言·算法·vim
逐·風4 小时前
unity关于自定义渲染、内存管理、性能调优、复杂物理模拟、并行计算以及插件开发
前端·unity·c#
捕鲸叉4 小时前
创建线程时传递参数给线程
开发语言·c++·算法
Devil枫4 小时前
Vue 3 单元测试与E2E测试
前端·vue.js·单元测试
A charmer4 小时前
【C++】vector 类深度解析:探索动态数组的奥秘
开发语言·c++·算法
Peter_chq4 小时前
【操作系统】基于环形队列的生产消费模型
linux·c语言·开发语言·c++·后端
尚梦5 小时前
uni-app 封装刘海状态栏(适用小程序, h5, 头条小程序)
前端·小程序·uni-app