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

JavaScript笔记APIs篇01——DOM获取与属性操作

 黑马程序员视频地址:黑马程序员前端JavaScript入门到精通全套视频教程https://www.bilibili.com/video/BV1Y84y1L7Nn?vd_source=0a2d366696f87e241adc64419bf12cab&spm_id_from=333.788.videopod.episodes&p=78https://www.bilibili.com/video/BV1Y84y1L7Nn?vd_source=0a2d366696f87e241adc64419bf12cab&spm_id_from=333.788.videopod.episodes&p=78 

目录

变量声明的选择 

基本数据类型 

引用数据类型

DOM获取与属性操作

Web API 基本认识

作用和分类

什么是DOM

DOM树

DOM对象

获取DOM对象

根据CSS选择器来获取DOM元素

选择匹配的第一个元素

选择匹配的多个元素

其他获取DOM元素方法

操作元素内容

元素.innerText 属性

元素.innerHTML 属性

操作元素属性

1.常用属性(标签内置属性 src等)

2.样式属性(CSS修饰属性)

通过style属性操作CSS

通过类名(className)操作CSS

通过classList操作CSS

3.表单元素属性

4.自定义属性

定时器(间歇函数)

开启定时器

关闭定时器


变量声明的选择 


基本数据类型 

 


引用数据类型


DOM获取与属性操作

Web API 基本认识

作用和分类


什么是DOM


DOM树


DOM对象


获取DOM对象

根据CSS选择器来获取DOM元素

选择匹配的第一个元素

 参考文档https://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelectorhttps://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelectorhttps://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelectorhttps://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelectorhttps://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelector


选择匹配的多个元素


其他获取DOM元素方法


操作元素内容

元素.innerText 属性


元素.innerHTML 属性


操作元素属性

1.常用属性(标签内置属性 src等)


2.样式属性(CSS修饰属性)

通过style属性操作CSS


通过类名(className)操作CSS


通过classList操作CSS


3.表单元素属性

 


4.自定义属性


定时器(间歇函数)

开启定时器


关闭定时器

相关文章:

JavaScript笔记APIs篇01——DOM获取与属性操作

黑马程序员视频地址:黑马程序员前端JavaScript入门到精通全套视频教程https://www.bilibili.com/video/BV1Y84y1L7Nn?vd_source0a2d366696f87e241adc64419bf12cab&spm_id_from333.788.videopod.episodes&p78https://www.bilibili.com/video/BV1Y84y1L7Nn?…...

SQL表间关联查询详解

简介 本文主要讲解SQL语句中常用的表间关联查询方式,包括:左连接(left join)、右连接(right join)、全连接(full join)、内连接(inner join)、交叉连接&…...

select函数

系统调用 select()可用于执行 I/O 多路复用操作&#xff0c;调用 select()会一直阻塞&#xff0c;直到某一个或多个文件描述符成为就绪态&#xff08;可以读或写&#xff09;。其函数原型如下所示&#xff1a; #include <sys/select.h> int select(int nfds, fd_set *re…...

建造者模式(或者称为生成器(构建器)模式)

一、什么是建造者模式&#xff1f; 将复杂对象的构建与表示进行分离&#xff0c;使得统一的构建过程&#xff0c;可以创建出不同的对象表现模式 就是将复杂对象里面的成员变量&#xff0c;设置不同的值&#xff0c;使得生成出来的对象拥有不同的属性值&#xff1b; 二、特点…...

【深度学习】Huber Loss详解

文章目录 1. Huber Loss 原理详解2. Pytorch 代码详解3.与 MSELoss、MAELoss 区别及各自优缺点3.1 MSELoss 均方误差损失3.2 MAELoss 平均绝对误差损失3.3 Huber Loss 4. 总结4.1 优化平滑4.2 梯度较好4.3 为什么说 MSE 是平滑的 1. Huber Loss 原理详解 Huber Loss 是一种结合…...

A5.Springboot-LLama3.2服务自动化构建(二)——Jenkins流水线构建配置初始化设置

下面我们接着上一篇文章《A4.Springboot-LLama3.2服务自动化构建(一)——构建docker镜像配置》继续往下分析,在自动化流水线构建过程当中的相关初始化设置和脚本编写。 一、首先需要先安装Jenkins 主部分请参考我前面写的一篇文章《Jenkins持续集成与交付安装配置》 二、…...

李宏毅机器学习HW1: COVID-19 Cases Prediction

Kaggle数据集和提交链接 特征选择&#xff08;主要修改地方&#xff09; 在sample code的基础上主要修改了Select_feat选择特征函数。 首先&#xff0c;因为数据集中的第一列是id&#xff0c;先在raw_x_train&#xff0c;raw_x_valid&#xff0c;raw_x_test中都去掉这一列。其…...

MySQL下载安装DataGrip可视化工具

目录 WinMySQL下载安装步骤MySQL配置添加环境变量 Mac下载安装配置环境变量 DataGrip可视化工具以Win为例了。Mac忘记截图了。步骤都一样 Win MySQL下载 官网&#xff1a; https://www.mysql.com/ 直接进下载界面&#xff1a; https://downloads.mysql.com/archives/installe…...

多平台下Informatica在医疗数据抽取中的应用

一、引言 1.医疗数据抽取与 Informatica 概述 1.1 医疗数据的特点与来源 1.1.1 数据特点 医疗数据具有显著的多样性特点。从数据类型来看&#xff0c;涵盖了结构化数据&#xff0c;如患者的基本信息、检验检查结果等&#xff0c;这些数据通常以表格形式存储&#xff0c;便于…...

用公网服务器实现内网穿透

首先需要一个公网服务器 下载frp 搜索github下载到frp&#xff0c;服务端frps/客户端frpc。。下载的时候要注意自己本地内网机的cpu版本和服务端cpu架构 我的电脑是mac M1PRO版本 下载的是&#xff1a;darwinarm64 比如 服务端一般是Linux&#xff08;Intel 64位CPU&#xf…...

为什么mysql更改表结构时,varchar超过255会锁表

在 MySQL 中&#xff0c;当修改表结构并将 VARCHAR 字段的长度设置为超过 255 时&#xff0c;可能会出现锁表的情况。这与 MySQL 的存储引擎&#xff08;主要是 InnoDB&#xff09;以及表的底层存储方式相关。 原因分析 行格式变化 InnoDB 存储引擎支持多种行格式&#xff08;…...

ASP.NET Core中 JWT 实现无感刷新Token

在 Web 应用开发中&#xff0c;用户登录状态的管理至关重要。为了避免用户频繁遇到登录过期的问题&#xff0c;我们可以通过实现 JWT&#xff08;JSON Web Token&#xff09;刷新机制来提升用户体验 推荐: 使用 Refresh Token&#xff08;双 Token 机制&#xff09; 1. 生成和…...

函数(函数的概念、库函数、自定义函数、形参和实参、return语句、数组做函数参数、嵌套调用和链式访问、函数的声明和定义、static和extern)

一、函数的概念 •C语⾔中的函数&#xff1a;⼀个完成某项特定的任务的⼀⼩段代码 •函数又被翻译为子函数&#xff08;更准确&#xff09; •在C语⾔中我们⼀般会⻅到两类函数&#xff1a;库函数 ⾃定义函数 二、库函数 1 .标准库和头文件 •C语⾔的国际标准ANSIC规定了⼀…...

物联网在烟草行业的应用

物联网技术在烟草行业的应用 物联网技术在烟草行业的应用主要体现在以下几个方面&#xff1a; 智能制造 &#xff1a;物联网技术可以实现对生产过程中的关键参数进行实时监测&#xff0c;确保产品的质量稳定可靠。同时&#xff0c;通过对设备的远程维护和故障诊断&#xff0c;…...

第6章:Python TDD实例变量私有化探索

写在前面 这本书是我们老板推荐过的&#xff0c;我在《价值心法》的推荐书单里也看到了它。用了一段时间 Cursor 软件后&#xff0c;我突然思考&#xff0c;对于测试开发工程师来说&#xff0c;什么才更有价值呢&#xff1f;如何让 AI 工具更好地辅助自己写代码&#xff0c;或许…...

Java操作Excel导入导出——POI、Hutool、EasyExcel

目录 一、POI导入导出 1.数据库导出为Excel文件 2.将Excel文件导入到数据库中 二、Hutool导入导出 1.数据库导出为Excel文件——属性名是列名 2.数据库导出为Excel文件——列名起别名 3.从Excel文件导入数据到数据库——属性名是列名 4.从Excel文件导入数据到数据库…...

BUUCTF_Web([GYCTF2020]Ezsqli)

1.输入1 &#xff0c;正常回显。 2.输入1 &#xff0c;报错false&#xff0c;为字符型注入&#xff0c;单引号闭合。 原因&#xff1a; https://mp.csdn.net/mp_blog/creation/editor/145170456 3.尝试查询字段&#xff0c;回显位置&#xff0c;数据库&#xff0c;都是这个。…...

微软宣布Win11 24H2进入新阶段!设备将自动下载更新

快科技1月19日消息&#xff0c;微软于1月16日更新了支持文档&#xff0c;宣布Windows 11 24H2进入新阶段。 24H2更新于2024年10月1日发布&#xff0c;此前为可选升级&#xff0c;如今微软开始在兼容的Windows 11设备上自动下载并安装24H2版本。 微软表示&#xff1a;“运行Wi…...

SpringBoot:解决前后端请求跨域问题(详细教程)

文章目录 一、前言二、解决方式 2.1 使用 CrossOrigin 注解&#xff08;简单方便&#xff0c;适用于单个或少量接口&#xff09;2.2 全局配置跨域&#xff08;适用于整个项目中大量接口都需要跨域的情况&#xff09;2.3 使用过滤器来处理跨域&#xff08;更底层的实现方式&…...

Android-V lmkd 中的那些属性值

源码基于&#xff1a;Android V 相关博文&#xff1a; Android lmkd 机制详解&#xff08;一&#xff09; Android lmkd 机制详解&#xff08;二&#xff09; Android lmkd 机制从R到T 1. 汇总 属性名说明默认值 ro.lmk.debug 启动 lmkd 的debug 模式&#xff0c;会打印一…...

终极指南:如何用AI快速生成高质量多语言字幕

终极指南&#xff1a;如何用AI快速生成高质量多语言字幕 【免费下载链接】openlrc Transcribe and translate voice into LRC file using Whisper and LLMs (GPT, Claude, et,al). 使用whisper和LLM(GPT&#xff0c;Claude等)来转录、翻译你的音频为字幕文件。 项目地址: htt…...

Mybatisplus 找不到分页组件

Mybatisplus的pom升级3.5.9后找不到分页组件类PaginationInnerInterceptor&#xff0c;挣扎一番发现需要单独导入一个pom&#xff0c;代码如下<dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-jsqlparser</artifactId><…...

TP4581 带自动开关机的锂电池充放电解决方案

概述 TP4581 是一款集成线性充电管理、同步升压转换、电池电量指示和多种保护功能的单芯片电源管理 SOC&#xff0c;为锂电池的充放电提供完整的单芯片电源解决方案。 TP4581 内部集成了线性充电管理模块、同步升压放电管理模块、电量检测与 LED 指示模块、保护模块、按键模块和…...

如何在Windows上轻松完成Android刷机:FastbootEnhance终极指南

如何在Windows上轻松完成Android刷机&#xff1a;FastbootEnhance终极指南 【免费下载链接】FastbootEnhance A user-friendly Fastboot ToolBox & Payload Dumper for Windows 项目地址: https://gitcode.com/gh_mirrors/fa/FastbootEnhance 还在为复杂的Android刷…...

kill-doc:你的文档下载终极解决方案,告别繁琐操作只需3步

kill-doc&#xff1a;你的文档下载终极解决方案&#xff0c;告别繁琐操作只需3步 【免费下载链接】kill-doc 看到经常有小伙伴们需要下载一些免费文档&#xff0c;但是相关网站浏览体验不好各种广告&#xff0c;各种登录验证&#xff0c;需要很多步骤才能下载文档&#xff0c;该…...

别再死记硬背DAX函数了!用这3个真实业务场景(销售分析/客户分层/动态排名)彻底搞懂PowerBI表操作

用真实业务场景解锁PowerBI表操作函数的实战价值 在数据分析领域&#xff0c;掌握DAX函数就像获得了一把瑞士军刀&#xff0c;但真正的高手不在于记住每个工具的名称&#xff0c;而在于知道何时使用以及如何组合它们解决实际问题。本文将带你跳出函数手册的死记硬背模式&#x…...

Zemax新手必看:从零开始设计808nm单透镜的完整流程(附BK7材料参数)

Zemax新手实战&#xff1a;808nm激光单透镜设计全流程与BK7材料深度解析 刚接触Zemax的光学设计新手往往会被各种参数设置和优化方法弄得晕头转向。本文将以808nm激光器常用的单透镜设计为例&#xff0c;手把手带你完成从理论计算到软件实操的全过程。不同于简单的教程复述&…...

Steam成就管理神器:3分钟掌握SAM的完全使用指南

Steam成就管理神器&#xff1a;3分钟掌握SAM的完全使用指南 【免费下载链接】SteamAchievementManager A manager for game achievements in Steam. 项目地址: https://gitcode.com/gh_mirrors/st/SteamAchievementManager Steam Achievement Manager&#xff08;简称SA…...

终极指南:用TegraRcmGUI轻松解锁Nintendo Switch的无限潜力

终极指南&#xff1a;用TegraRcmGUI轻松解锁Nintendo Switch的无限潜力 【免费下载链接】TegraRcmGUI C GUI for TegraRcmSmash (Fuse Gele exploit for Nintendo Switch) 项目地址: https://gitcode.com/gh_mirrors/te/TegraRcmGUI 还在为Nintendo Switch的封闭系统感到…...

大语言模型作为语种民族文明压缩镜像的映射特性分析

摘要 大语言模型通过预测下一个词学习语言概率模式的本质&#xff0c;使其成为其所训练语料库的统计压缩体。这种本质决定了模型能够映射特定语种民族或文明的深层文化偏好&#xff0c;成为一个独特的“压缩镜像”。该镜像并非对文明的完整复制&#xff0c;而是基于海量文本数据…...