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

JavaScript(JS)的对象

news 2025/7/16 16:47:40

目录

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(元素列表); 定义方式…...

编程日记 2024/12/5 0:19:28

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

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

编程日记 2024/12/5 0:14:23

git推送多个仓库

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

编程日记 2024/12/5 0:13:21

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

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

编程日记 2024/12/5 0:12:20

PostgreSQL认证培训需要什么条件

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

编程日记 2024/12/5 0:11:19

Oracle—系统包使用

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

编程日记 2024/12/5 0:07:14

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

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

编程日记 2024/12/5 0:05:12

【SpringBoot】整合篇

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

编程日记 2024/12/5 0:04:11

写入json和读取json文件

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

编程日记 2024/12/5 0:01:07

Vuex的理解及使用场景

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

编程日记 2024/12/4 23:52:58

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); …...

编程日记 2024/12/4 23:51:57

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

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

编程日记 2024/12/4 23:49:54

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

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

编程日记 2024/12/4 23:48:54

MATLAB - ROS2 ros2genmsg 生成自定义消息（msg/srv...）

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

编程日记 2024/12/4 23:47:52

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

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

编程日记 2024/12/4 23:46:51

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

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…...

编程日记 2024/12/4 23:45:50

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

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

编程日记 2024/12/4 23:43:49

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

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

编程日记 2024/12/4 23:41:46

selinux与防火墙

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

编程日记 2024/12/4 23:39:44

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

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

编程日记 2024/12/4 23:34:36

19c补丁后oracle属主变化，导致不能识别磁盘组

补丁后服务器重启&#xff0c;数据库再次无法启动 ORA01017: invalid username/password; logon denied Oracle 19c 在打上 19.23 或以上补丁版本后&#xff0c;存在与用户组权限相关的问题。具体表现为&#xff0c;Oracle 实例的运行用户&#xff08;oracle&#xff09;和集…...

编程新知 2025/7/16 3:54:27

linux之kylin系统nginx的安装

一、nginx的作用 1.可做高性能的web服务器 直接处理静态资源&#xff08;HTML/CSS/图片等&#xff09;&#xff0c;响应速度远超传统服务器类似apache支持高并发连接 2.反向代理服务器 隐藏后端服务器IP地址&#xff0c;提高安全性 3.负载均衡服务器 支持多种策略分发流量…...

编程新知 2025/7/15 10:29:13

AI Agent与Agentic AI：原理、应用、挑战与未来展望

文章目录 一、引言二、AI Agent与Agentic AI的兴起2.1 技术契机与生态成熟2.2 Agent的定义与特征2.3 Agent的发展历程 三、AI Agent的核心技术栈解密3.1 感知模块代码示例&#xff1a;使用Python和OpenCV进行图像识别 3.2 认知与决策模块代码示例&#xff1a;使用OpenAI GPT-3进…...

编程新知 2025/7/13 13:40:47

2025 后端自学UNIAPP【项目实战：旅游项目】6、我的收藏页面

代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口&#xff08;适配服务端返回 Token&#xff09; export const login async (code, avatar) > {const res await http…...

编程新知 2025/7/16 3:42:48

【服务器压力测试】本地PC电脑作为服务器运行时出现卡顿和资源紧张（Windows/Linux）

要让本地PC电脑作为服务器运行时出现卡顿和资源紧张的情况&#xff0c;可以通过以下几种方式模拟或触发&#xff1a; 1. 增加CPU负载 运行大量计算密集型任务&#xff0c;例如&#xff1a; 使用多线程循环执行复杂计算&#xff08;如数学运算、加密解密等&#xff09;。运行图…...

编程新知 2025/6/21 3:16:21

Python如何给视频添加音频和字幕

在Python中&#xff0c;给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加&#xff0c;包括必要的代码示例和详细解释。 环境准备 在开始之前&#xff0c;需要安装以下Python库&#xff1a;…...

编程新知 2025/6/20 22:43:59

Maven 概述、安装、配置、仓库、私服详解

目录 1、Maven 概述 1.1 Maven 的定义 1.2 Maven 解决的问题 1.3 Maven 的核心特性与优势 2、Maven 安装 2.1 下载 Maven 2.2 安装配置 Maven 2.3 测试安装 2.4 修改 Maven 本地仓库的默认路径 3、Maven 配置 3.1 配置本地仓库 3.2 配置 JDK 3.3 IDEA 配置本地 Ma…...

编程新知 2025/7/13 5:58:28

基于 TAPD 进行项目管理

起因 自己写了个小工具&#xff0c;仓库用的Github。之前在用markdown进行需求管理&#xff0c;现在随着功能的增加&#xff0c;感觉有点难以管理了&#xff0c;所以用TAPD这个工具进行需求、Bug管理。 操作流程 注册 TAPD&#xff0c;需要提供一个企业名新建一个项目&#…...

编程新知 2025/7/13 20:40:15

Python 训练营打卡 Day 47

注意力热力图可视化 在day 46代码的基础上&#xff0c;对比不同卷积层热力图可视化的结果 import torch import torch.nn as nn import torch.optim as optim from torchvision import datasets, transforms from torch.utils.data import DataLoader import matplotlib.pypl…...

编程新知 2025/7/6 11:33:09

GraphQL 实战篇：Apollo Client 配置与缓存

GraphQL 实战篇&#xff1a;Apollo Client 配置与缓存 上一篇&#xff1a;GraphQL 入门篇&#xff1a;基础查询语法 依旧和上一篇的笔记一样&#xff0c;主实操&#xff0c;没啥过多的细节讲解&#xff0c;代码具体在&#xff1a; https://github.com/GoldenaArcher/graphql…...

编程新知 2025/7/15 23:03:42