当前位置: 首页 > news >正文

JavaScript(JS)的对象

目录

1.array 数组对象

2.String 字符串对象

3.JSON 对象(数据载体,进行数据传输)

4.BOM 浏览器对象

5.DOM 文档对象(了解)


1.array 数组对象

定义方式1:var 变量名 = new Array(元素列表);

定义方式2:var 变量名 = [元素列表];   注:中括号

特点:长度可变 类型可变

数组常用方法:

forEach() 

 遍历数组中的每个有值的元素,并调用一次传入的函数

Push()

将新元素添加到数组的末尾,并返回新的长度

Splice()

从数组中删除元素

ES6 箭头函数:(…) => {…} 

 简化函数定义

2.String 字符串对象

方式1:var 变量名 = new String("…");

方式2:var 变量名 = "…";

注:" 和 ' 都可以定义字符串

常用方法:

charAt()

  返回在指定位置的字符

IndexOf()

检索字符串

Trim()

去除字符串两边的空格

Substring()

提取字符串中两个指定的索引号之间的字符

3.JSON 对象(数据载体,进行数据传输)

JS自定义对象定义格式:

Var 对象名 = {

属性名1: 属性值1,

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

};

省略后:函数名称(形参列表){ }

案例:

调用格式:

对象名.属性名;

对象名.函数名();

JSON:

定义(JSON字符串):

var 变量名 = '{"key1": value1, "key": value2}';

补:数组(方括号中)   

 对象(花括号中)

案例:

var userStr = '{"name": "Alice","age": 16, "addr": ["天空之城", "天之彼方", "恶魔城"]}'

JSON字符串转为JS对象

var jsObject = JSON.parse(userStr);

JS对象转为JSON字符串

var jsonStr = JSON.stringify(jsObject);

4.BOM 浏览器对象

1.window:浏览器窗口对象

获取:

window.alert("Hello Window");

alert("Hello Window");    window.  可以省略

方法:

alert();

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

confirm();

 显示带有一段消息和确认按钮和取消按钮的对话框

setlnterval();

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

setTimeout();

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

案例:

2.location:地址栏对象

获取:

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

window.location.属性;

location.属性;

属性:

href:设置或返回完整的URL

案例:

5.DOM 文档对象(了解,Vue3可代替)

作用:获取元素对象,然后为进行操作元素做准备

将标记语言的各个组成部分封装为对应的对象,便于后续操作改变对象:

Document

 整个文档对象 例:<html>

Element

元素对象 例:<a>,<div>,<body>…

Attribute

属性对象 例:href="…"

Text

文本对象   就是内容的文字等

Comment

注释对象 

通过DOM操作,对HTML进行操作:

1.改变HTML元素的内容

2.改变HTML元素的样式(CSS)

3.对HTML DOM事件做出反应

4.添加和删除HTML元素

Document对象中提供了获取Element元素对象的函数:

1.根据id 属性值获取,返回单个Element对象

var h1 = document.getElementById('h1');

2.根据标签名称获取,返回Element对象数组

var divs = document.getElementsByTagName('div');

3.根据name属性值获取,返回Element对象数组

var hobbys = document.getElementsByName('hobby');

4.根据class属性值获取,返回Element对象数组

var clss = document.getElementsByClassName('cls');

最后在网站上找对应标签的函数(方法)进行操作实现.

参考书网站:JavaScript 和 HTML DOM 参考手册

事件监听

常见事件:

onclick

 鼠标单击事件

onblur

元素失去焦点

onfocus

元素获得焦点

onload

某个页面或图像被完成加载

onsubmit

当表单提交时触发该事件

onkeydown

某个键盘的键被按下

onmouseover

鼠标被移到某元素上

onmouseout

鼠标从某元素移开

实现操作:

相关文章:

JavaScript(JS)的对象

目录 1.array 数组对象 2.String 字符串对象 3.JSON 对象&#xff08;数据载体&#xff0c;进行数据传输&#xff09; 4.BOM 浏览器对象 5.DOM 文档对象&#xff08;了解&#xff09; 1.array 数组对象 定义方式1&#xff1a;var 变量名 new Array(元素列表); 定义方式…...

基于BM1684的AI边缘服务器-模型转换,大模型一体机

介绍 我们属于SoC模式&#xff0c;即我们在x86主机上基于tpu-nntc和libsophon完成模型的编译量化与程序的交叉编译&#xff0c;部署时将编译好的程序拷贝至SoC平台&#xff08;1684开发板/SE微服务器/SM模组&#xff09;中执行。 注&#xff1a;以下都是在Ubuntu20.04系统上操…...

git推送多个仓库

在 Git 中&#xff0c;可以通过添加多个远程仓库来实现一次 git push 推送到多个仓库&#xff0c;比如同时推送到 Gitee 和 GitHub。以下是详细的设置步骤&#xff1a; 1. 添加多个远程仓库 假设你的项目已经有一个远程仓库&#xff08;例如 GitHub&#xff09;&#xff0c;你…...

Matlab mex- setup报错—错误使用 mex,未检测到支持的编译器...

错误日志&#xff1a; 在使用mex编译时报错提示&#xff1a;错误使用 mex&#xff0c;未检测到支持的编译器。您可以安装免费提供的 MinGW-w64 C/C 编译器&#xff1b;请参阅安装 MinGW-w64 编译器。有关更多选项&#xff0c;请访问https://www.mathworks.com/support/compile…...

PostgreSQL认证培训需要什么条件

PostgreSQL认证培训通常没有严格的前置条件&#xff0c;但以下几点可以帮助你更好地准备和通过认证考试&#xff1a; 1、基础知识&#xff1a;具备基本的数据库知识和经验&#xff0c;特别是对SQL有一定的了解。如果你Oracle、MySQL等基础知识&#xff0c;对对你学习PostgreSQ…...

Oracle—系统包使用

文章目录 系统包dbms_redefinition 系统包 dbms_redefinition 功能介绍&#xff1a;该包体可以实现将Oracle库下的表在线改为分区结构或者重新定义&#xff1b; 说明&#xff1a;在检查表是否可以重定义和开始重定义的过程中&#xff0c;按照表是否存在主键&#xff0c;参数 o…...

【排序用法】.NET开源 ORM 框架 SqlSugar 系列

&#x1f4a5; .NET开源 ORM 框架 SqlSugar 系列 &#x1f389;&#x1f389;&#x1f389; 【开篇】.NET开源 ORM 框架 SqlSugar 系列【入门必看】.NET开源 ORM 框架 SqlSugar 系列【实体配置】.NET开源 ORM 框架 SqlSugar 系列【Db First】.NET开源 ORM 框架 SqlSugar 系列…...

【SpringBoot】整合篇

1、log4j2 第一步&#xff0c;导入依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> <exclusions><!-- 去掉springboot默认配置 --> <exclusion> <…...

写入json和读取json文件

/// <summary> ///写入文件 /// </summary> /// <param name"Stns"></param> /// <returns></returns> public ActionResult WriteJsonFile(string Stns) { strin…...

Vuex的理解及使用场景

Vuex 是 Vue.js 应用中一个专门为状态管理而设计的库&#xff0c;它基于 Fluts 和 Redux 的模式。Vuex 提供了一种集中式存储管理所有组件的状态&#xff0c;并以相应的规则保证状态以一种可预测的方式发生变化。以下是 Vuex 的理解及使用场景&#xff1a; Vuex 的理解 核心概…...

PostGis学习笔记

– 文本方式查看几何数据 SELECT ST_AsText(geom)FROM nyc_streets WHERE name ‘Avenue O’; – 计算紧邻的街区 SELECT name,ST_GeometryType(geom) FROM nyc_streets WHERE ST_DWithin( geom,ST_GeomFromText(‘LINESTRING(586782 4504202,586864 4504216)’,26918),0.1); …...

Qt 窗口类型、窗口标志和窗口属性

一、窗口类型 Qt 窗口标志枚举类型用于指定小部件的各种窗口系统属性。其中一些标志取决于底层窗口管理器是否支持它们。以下是窗口类型: Qt::QWidget:这是 QWidget 的默认类型。如果它们有父级,这种类型的部件是子部件,如果没有父控件,则为独立窗口。Qt::Window:通常具…...

相机学习笔记——工业相机的基本参数

0、相机分类 图像颜色不同可以分为黑白相机和彩色相机&#xff1a;相同分辨率下&#xff0c;黑白工业相机相比彩色工业相机精度更高&#xff0c;检测图像边缘时&#xff0c;黑白工业相机成像效果更好。 芯片类型不同可以分为CCD相机和CMOS相机&#xff1a;CCD工业相机具有体积小…...

MATLAB - ROS2 ros2genmsg 生成自定义消息(msg/srv...)

系列文章目录 前言 语法 ros2genmsg(folderpath)ros2genmsg(folderpath,Name=Value) 一、说明 ros2genmsg(folderpath) 通过读取指定文件夹路径下的 ROS 2 自定义信息和服务定义来生成 ROS 2 自定义信息。函数文件夹必须包含一个或多个 ROS 2 软件包。这些软件包包含 .msg 文…...

【Git 操作】-- 将 fork master 分支的最新commit更新到自己的仓库

目录 1.举例 2. 配置上游仓库&#xff08;Upstream&#xff09; 3. 获取上游仓库的更新 4. 切换到你自己的 master 分支 5. 合并上游仓库的 master 分支 6. 解决冲突&#xff08;如果有的话&#xff09; 7. 推送更新到你自己的 GitHub 仓库 1.举例 当我们从 github 的 h…...

[高等数学学习记录] 泰勒公式

1 知识点 1.1 要求 为简化计算, 通常用多项式近似表达复杂函数: 设函数 f ( x ) f(x) f(x) 在含有 x 0 x_0 x0​ 的开区间内具有 ( n 1 ) (n1) (n1) 阶导数, 试找出一个关于 ( x − x 0 ) (x-x_0) (x−x0​) 的 n n n 次多项式 p n ( x ) p_n(x) pn​(x) 近似表达 f…...

我的创作纪念日—128天的坚持|分享|成长

&#x1f4ab;《博主介绍》&#xff1a;✨又是一天没白过&#xff0c;我是奈斯&#xff0c;DBA一名✨ &#x1f4ab;《擅长领域》&#xff1a;✌️擅长Oracle、MySQL、SQLserver、阿里云AnalyticDB for MySQL(分布式数据仓库)、Linux&#xff0c;也在扩展大数据方向的知识面✌️…...

万字长文解读深度学习——多模态模型BLIP2

&#x1f33a;历史文章列表&#x1f33a; 深度学习——优化算法、激活函数、归一化、正则化 深度学习——权重初始化、评估指标、梯度消失和梯度爆炸 深度学习——前向传播与反向传播、神经网络&#xff08;前馈神经网络与反馈神经网络&#xff09;、常见算法概要汇总 万字长…...

selinux与防火墙

selinux 什么是selinux SELinux 是 Security-Enhanced Linux 的缩写&#xff0c;意思是安全强化的 linux 。 SELinux 主要由美国国家安全局&#xff08; NSA &#xff09;开发&#xff0c;当初开发的目的是为了避免资源的误用。 系统资源都是通过程序进行访问的&#xff0…...

java基础概念47-ArrayList、LinkList和迭代器

一、ArrayList集合 1-1、ArrayList的两种添加信息的方式 1-2、ArrayList集合底层逻辑 1、利用空参创建的集合&#xff0c;在底层创建一个默认长度为0的数组 2、添加第一个元素时&#xff0c;底层会创建一个新的长度为10的数组 3、存满时&#xff0c;会扩容1.5倍。 4、如果…...

从零到盈利:Unity小游戏如何通过穿山甲广告实现收入最大化

从零到盈利&#xff1a;Unity小游戏如何通过穿山甲广告实现收入最大化 在移动游戏市场&#xff0c;广告变现已成为中小开发者最可靠的收入来源之一。根据行业数据显示&#xff0c;超休闲游戏开发者平均70%的收入来自广告展示&#xff0c;而穿山甲作为国内领先的广告平台&#x…...

CCF算法大赛C题详解:如何将整数m转换为n进制并输出特定多项式格式(附Python代码逐行分析)

CCF算法大赛C题详解&#xff1a;从进制转换到多项式格式化的完整指南 在编程竞赛中&#xff0c;处理数字的进制转换和特定格式输出是常见的基础题型。CCF算法大赛的这道题目巧妙地将这两个概念结合在一起&#xff0c;要求参赛者不仅实现进制转换&#xff0c;还要按照严格的规则…...

Python flask django房屋租赁管理系统在线聊天

目录同行可拿货,招校园代理 ,本人源头供货商功能需求分析技术实现方案安全与扩展功能性能优化项目技术支持源码获取详细视频演示 &#xff1a;文章底部获取博主联系方式&#xff01;同行可合作同行可拿货,招校园代理 ,本人源头供货商 功能需求分析 用户身份区分 系统需区分房…...

Deneyap Servo库:ESP32硬件PWM舵机精准控制方案

1. Deneyap Servo 库概述&#xff1a;面向 ESP32 系列平台的高精度舵机控制方案Deneyap Servo 是一个专为 Deneyap 系列开发板&#xff08;基于 ESP32、ESP32-S2、ESP32-C3 和 ESP32-S3&#xff09;设计的 Arduino 兼容舵机驱动库。该库并非简单封装 Arduino IDE 自带的Servo.h…...

SH_MLCD_J:Sharp HR-TFT内存液晶驱动库详解

1. 项目概述SH_MLCD_J 是一款专为驱动 Sharp 公司 HR-TFT 系列单色内存液晶显示屏&#xff08;Monochrome Memory LCD&#xff09;设计的嵌入式底层图形库。该库被广泛应用于秋月电子等国内元器件分销商所售的 SHARP 原厂模组&#xff0c;典型型号包括 LS013B7DH03、LS027B7DH0…...

2025届毕业生推荐的AI科研平台推荐榜单

Ai论文网站排名&#xff08;开题报告、文献综述、降aigc率、降重综合对比&#xff09; TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 使AIGC检测率得以降低的关键所在是去削弱文本具备的规律性以及模式化特性。具体的策略涵盖这…...

AO3镜像站终极访问指南:3步解决同人作品访问难题

AO3镜像站终极访问指南&#xff1a;3步解决同人作品访问难题 【免费下载链接】AO3-Mirror-Site 项目地址: https://gitcode.com/gh_mirrors/ao/AO3-Mirror-Site Archive of Our Own&#xff08;AO3&#xff09;作为全球最大的同人作品平台&#xff0c;为无数创作者和读…...

高质量高权重SEO外链平台的海量资源有哪些

高质量高权重SEO外链平台的海量资源有哪些 在当今竞争激烈的互联网市场中&#xff0c;网站的SEO优化至关重要。高质量高权重的SEO外链平台不仅能提升网站的排名&#xff0c;还能带来更多的流量和业务机会。究竟有哪些高质量高权重的SEO外链平台&#xff0c;它们的资源能为我们…...

好写作AI“学术清道夫”:论文查重,为学术诚信保驾护航

在学术的浩瀚星空中&#xff0c;论文是学子们展示智慧与研究成果的璀璨星辰。然而&#xff0c;随着学术交流的日益频繁&#xff0c;论文抄袭、剽窃等不端行为也时有发生&#xff0c;这不仅损害了学术的公正性和严肃性&#xff0c;也阻碍了学术的健康发展。在这样的背景下&#…...

JL杰理AC696N开发板PWM波形生成与控制(1):频率、占空比

引言PWM这玩意儿&#xff0c;做调光、调速、甚至模拟音频都离不开。JL杰理AC696N的定时器自带PWM输出功能&#xff0c;配置起来不算复杂&#xff0c;但真要调出稳定的波形&#xff0c;有几个坑是绕不开的。比如初始化的时候LED会闪一下、占空比设0反而输出一个高电平、想换个引…...