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

JS(三)——更改html内数据

  • 获取 DOM 元素,然后修改其属性或内容。使用 getElementById 方法获取特定 ID 的元素:
<p id="myParagraph">这是初始的文本</p>
const paragraph = document.getElementById('myParagraph');
paragraph.innerHTML = '这是修改后的文本';
  • 通过修改元素的属性,比如修改 img 元素的 src 属性:
<img id="myImage" src="old.jpg" />
const image = document.getElementById('myImage');
image.src = 'new.jpg';

使用 getElementsByTagName 或 getElementsByClassName 方法获取一组元素进行修改

<p class="myClass">第一段</p>
<p class="myClass">第二段</p>
const paragraphs = document.getElementsByClassName('myClass');
for (let i = 0; i < paragraphs.length; i++) {paragraphs[i].innerHTML = '修改后的段落';
}

相关文章:

JS(三)——更改html内数据

获取 DOM 元素&#xff0c;然后修改其属性或内容。使用 getElementById 方法获取特定 ID 的元素&#xff1a; <p id"myParagraph">这是初始的文本</p> const paragraph document.getElementById(myParagraph); paragraph.innerHTML 这是修改后的文本…...

CSS小玩意儿:文字适配背景

一&#xff0c;效果 二&#xff0c;代码 1&#xff0c;搭个框架 添加一张背景图片&#xff0c;在图片中显示一行文字。 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" conte…...

C++:平衡二叉搜索树之红黑树

一、红黑树的概念 红黑树&#xff0c; 和AVL都是二叉搜索树&#xff0c; 红黑树通过在每个节点上增加一个储存位表示节点的颜色&#xff0c; 可以是RED或者BLACK&#xff0c; 通过任何一条从根到叶子的路径上各个节点着色方式的限制&#xff0c;红黑树能够确保没有一条路径会比…...

CentOS 7 系统优化

CentOS 7 系统优化 1、配置YUM源 阿里云的YUM源配置&#xff1a; CentOS 7使用以下命令&#xff1a; sudo wget -O /etc/yum.repos.d/CentOS-Base.repo http://mirrors.aliyun.com/repo/Centos-7.repoCentOS 8使用以下命令&#xff1a; sudo wget -O /etc/yum.repos.d/CentOS…...

扫雷游戏——附源代码

扫雷游戏的源代码比较简单&#xff0c;不设计比较复杂的代码&#xff0c;主要是多个函数的组合&#xff0c;每个函数执行自己的功能&#xff0c;最终支持游戏的完成。 1.菜单 我们需要一个提醒信息来让用户进行选择。 void menu() {printf("***********************\n&…...

Vue3列表(List)

效果如下图&#xff1a;在线预览 APIs List 参数说明类型默认值bordered是否展示边框booleanfalsevertical是否使用竖直样式booleanfalsesplit是否展示分割线booleantruesize列表尺寸‘small’ | ‘middle’ | ‘large’‘middle’loading是否加载中booleanfalsehoverable是否…...

HarmonyOS NEXT - Navigation组件封装BaseNavigation

demo 地址: https://github.com/iotjin/JhHarmonyDemo 代码不定时更新&#xff0c;请前往github查看最新代码 在demo中这些组件和工具类都通过module实现了&#xff0c;具体可以参考HarmonyOS NEXT - 通过 module 模块化引用公共组件和utils 官方介绍 组件导航 (Navigation)(推…...

浅看MySQL数据库

有这么一句话&#xff1a;“一个不会数据库的程序员不是合格的程序员”。有点夸张&#xff0c;但是确是如此。透彻学习数据库是要学习好多知识&#xff0c;需要学的东西也是偏难的。我们今天来看数据库MySQL的一些简单基础东西&#xff0c;跟着小编一起来看一下吧。 什么是数据…...

Pytorch常用训练套路框架(CPU)

文章目录 1. 数据准备示例&#xff1a;加载 CIFAR-10 数据集 2. 模型定义示例&#xff1a;定义一个简单的卷积神经网络 3. 损失函数和优化器示例&#xff1a;定义损失函数和优化器 4. 训练循环示例&#xff1a;训练循环 5. 评估和测试示例&#xff1a;评估模型 6. 保存和加载模…...

C++ | Leetcode C++题解之第338题比特位计数

题目&#xff1a; 题解&#xff1a; class Solution { public:vector<int> countBits(int n) {vector<int> bits(n 1);for (int i 1; i < n; i) {bits[i] bits[i & (i - 1)] 1;}return bits;} };...

智慧校园云平台电子班牌系统源码,智慧教育一体化云解决方案

智慧校园云平台电子班牌系统&#xff0c;利用先进的云计算技术&#xff0c;将教育信息化资源和教学管理系统进行有效整合&#xff0c;实现生态基础数据共享、应用生态统一管理&#xff0c;为智慧教育建设的统一性&#xff0c;稳定性&#xff0c;可扩展性&#xff0c;互通性提供…...

数据库系统 第17节 数据仓库 案例赏析

下面我将通过几个具体的案例来说明数据仓库如何在不同的行业中发挥作用&#xff0c;并解决实际业务问题。 案例 1: 零售业 背景: 一家大型零售商希望改进其库存管理和市场营销策略&#xff0c;以提高销售额和顾客满意度。 解决方案: 数据仓库: 构建一个数据仓库&#xff0…...

硬件面试经典 100 题(71~90 题)

71、请问下图电路的作用是什么&#xff1f; 该电路实现 IIC 信号的电平转换&#xff08;3.3V 和 5V 电平转换&#xff09;&#xff0c;并且是双向通信的。 上下两路是一样的&#xff0c;只分析 SDA 一路&#xff1a; 1&#xff09; 从左到右通信&#xff08;SDA2 为输入状态&…...

【git】代理相关

问题&#xff1a; 开启了翻墙代理工具&#xff0c;拉取代码时报错&#xff1a;fatal: 无法访问 xxxx : Failed to connect to github.com port 443: 连接超时 解决&#xff1a; 0&#xff0c;取消代理仍然无法拉取 1&#xff0c;查看控制面板-网络与Internet-代理&#xff…...

golang gin框架中创建自定义中间件的2种方式总结 - func(*gin.Context)方式和闭包函数方式定义gin中间件

在gin框架中&#xff0c;我们可以通过2种方式创建自定义中间件&#xff1a; 1. 直接定义一个类型为 func(*gin.Context)的函数或者方法 这种方式是我们常用的方式&#xff0c;也就是定义一个参数为*gin.Context的函数或者方法。定义的方法就是创建一个 参数类型为 gin.Handler…...

Linux高级编程 8.13 文件IO

一、文件IO 操作系统为了方便用户使用系统功能而对外提供的一组系统函数。称之为 系统调用&#xff08;unistd.h&#xff09; 其中有个 文件IO&#xff0c;一般都是对设备文件操作,当然也可以对普通文件进行操作。 这是一个基于Linux内核的没有缓存的IO机制 文件IO特性&…...

【k8s】ubuntu18.04 containerd 手动从1.7.15 换为1.7.20

ubutnu18.04之前手动安装了1.7.15现在下载1.7.20containerd-1.7.20-linux-amd64.tar.gz root@k8s-worker-i58265u:/home/zhangbin# root@k8s-worker-i58265u:/home/zhangbin# https://github.com/containerd/containerd/releases/download/v1.7.20/containerd-1.7.20-linux-am…...

常用浮动方式

目录 一、标准流 二、float浮动 三、 flex浮动 3.1flex组成 3.2 主轴对齐方式 3.3侧轴对齐方式 3.4修改主轴方向 3.5弹性盒子换行 3.6行对齐方式 一、标准流 标签在网页中的默认排布规则 例如&#xff1a; 块元素独占一行、行内元素可以一行显示多个 二、float浮动 让块…...

设计模式反模式:UML常见误用案例分析

文章目录 设计模式反模式&#xff1a;UML常见误用案例分析1. 反模式概述2. 反模式的 UML 图示误用2.1 God Object 反模式2.2 Spaghetti Code 反模式2.3 Golden Hammer 反模式2.4 Poltergeist 反模式 3. 总结 设计模式反模式&#xff1a;UML常见误用案例分析 在软件工程领域&am…...

Python编码系列—Python SQL与NoSQL数据库交互:深入探索与实战应用

&#x1f31f;&#x1f31f; 欢迎来到我的技术小筑&#xff0c;一个专为技术探索者打造的交流空间。在这里&#xff0c;我们不仅分享代码的智慧&#xff0c;还探讨技术的深度与广度。无论您是资深开发者还是技术新手&#xff0c;这里都有一片属于您的天空。让我们在知识的海洋中…...

用快马AI快速原型设计:9·1免费素材库管理界面十分钟搭建指南

最近在帮朋友设计一个免费素材库的管理界面&#xff0c;需求是要快速搭建一个能展示"91免费素材"的网页应用。作为一个经常需要验证设计想法的开发者&#xff0c;我发现用InsCode(快马)平台可以大大缩短原型开发时间。下面分享下我是如何在十分钟内完成这个素材库管理…...

Qwen3.5-4B-Claude-Opus部署教程:supervisor托管+健康检查全流程详解

Qwen3.5-4B-Claude-Opus部署教程&#xff1a;supervisor托管健康检查全流程详解 1. 模型介绍 Qwen3.5-4B-Claude-4.6-Opus-Reasoning-Distilled-GGUF 是一个基于 Qwen3.5-4B 的推理蒸馏模型&#xff0c;重点强化了结构化分析、分步骤回答、代码与逻辑类问题的处理能力。该版本…...

白城腾讯广告服务商

在白城&#xff0c;有不少企业想借助腾讯广告拓展业务&#xff0c;这就离不开靠谱的腾讯广告服务商。今天就和大家聊聊白城腾讯广告服务商的那些事儿&#xff0c;长春中网互联技术在这一领域表现就相当不错。白城腾讯广告服务商现状行业报告显示&#xff0c;近几年白城地区对腾…...

std::unique_lock vs std::lock_guard:C++线程锁选择指南(附性能测试)

std::unique_lock vs std::lock_guard&#xff1a;C线程锁的深度抉择与实战优化 在C多线程编程中&#xff0c;锁的选择往往决定了程序的性能表现和稳定性。当我们需要在std::unique_lock和std::lock_guard之间做出选择时&#xff0c;不能简单地认为"功能多就是好"。本…...

[路径保护]解决中文路径乱码:从名称错乱到Unicode支持的实践指南

[路径保护]解决中文路径乱码&#xff1a;从名称错乱到Unicode支持的实践指南 【免费下载链接】calibre-do-not-translate-my-path Switch my calibre library from ascii path to plain Unicode path. 将我的书库从拼音目录切换至非纯英文&#xff08;中文&#xff09;命名 项…...

PTA编程题‘Person抽象类’避坑指南:变量命名冲突、多态指针数组与输出格式化的那些坑

PTA编程题‘Person抽象类’避坑指南&#xff1a;变量命名冲突、多态指针数组与输出格式化的那些坑 在C面向对象编程的实战中&#xff0c;抽象类和派生类的设计看似简单&#xff0c;却暗藏诸多陷阱。许多初学者在完成PTA/LeetCode这类编程题时&#xff0c;往往因为一些看似微不足…...

Llama-3.2V-11B-cot部署教程:WSL2环境下双4090识别与分配验证

Llama-3.2V-11B-cot部署教程&#xff1a;WSL2环境下双4090识别与分配验证 1. 项目概述 Llama-3.2V-11B-cot是基于Meta Llama-3.2V-11B-cot多模态大模型开发的高性能视觉推理工具。该工具针对双卡4090环境进行了深度优化&#xff0c;特别适合在WSL2环境下部署使用。通过本教程…...

从FCN到U-Net:盘点深度学习图像分割中,那些‘放大’特征图的秘密武器与选型指南

从FCN到U-Net&#xff1a;解码图像分割中的特征图放大技术选型 在构建图像分割模型时&#xff0c;特征图的上采样操作往往是决定最终分割精度的关键环节之一。不同于分类任务只需输出一个类别标签&#xff0c;分割网络需要对每个像素进行分类&#xff0c;这就要求网络能够将低分…...

既然有 HTTP 协议,为什么还要有 RPC?

HTTP 和 RPC 都能解决网络通信问题&#xff0c;但它们的设计初衷和适用场景截然不同。简单来说&#xff0c;HTTP 是为了通用性和跨平台设计的&#xff08;像万能的集装箱&#xff09;&#xff0c;而 RPC 是为了极致的性能和开发效率设计的&#xff08;像工厂内部的高速流水线&a…...

数电课设实战:从555定时器到74LS190,手把手搭建一个密码锁系统

1. 密码锁系统设计概述 第一次接触数字电路课设时&#xff0c;我和大多数同学一样&#xff0c;面对一堆芯片和电路图完全无从下手。直到教授建议从密码锁这个经典项目入手&#xff0c;我才发现原来数电可以这么有趣。这个系统最精妙的地方在于&#xff0c;它把课本上枯燥的理论…...