JS06-class对象

class对象

className

修改样式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div {width: 200px;height: 200px;background-color: aqua;}.action {width: 300px;height: 300px;background-color: pnik;margin-left: 100px;}</style>
</head>
<body><div></div><script>let box = document.querySelector('div')box.className = 'action'</script>
</body>
</html>

classList

修改样式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div {width: 200px;height: 200px;background-color: aqua;}.action {width: 300px;height: 300px;background-color: pnik;margin-left: 100px;}</style>
</head>
<body><div class="one"></div><script>let box = document.querySelector('div')// add 追加box.classList.add('action')// remove 移除box.classList.remove('one')// 切换类box.classList.toggle('one')</script>
</body>
</html>

修改表单属性

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><input type="text" name="" id="" value="请输入"><button disabled>按钮</button><input type="checkbox" name="" id="" class="agree"><script>let input = document.querySelector('input')input.value = '小米'input.type = 'password'let btn =document.querySelector('button')btn.disabled = truelet checkbox = document.querySelector('.agree')checkbox.checked = true</script>
</body>
</html>

间歇函数(定时器)

        setInterval(function(){console.log('color');},1000)function show (){console.log('Zero')}// 开启定时器let timer = setInterval(show,1000)// 清除定时器clearInterval(timer)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/752024.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

短剧小程序软件开发首页接口转发到Selectpage

工具&#xff1a;用的是uniapp开发 技术栈&#xff1a;vue、nide..js、云开发 用时&#xff1a;20工作天 软件&#xff1a;Hb、微信开发者工具 <?php namespace app\api\controller; use app\common\controller\Api; /** * 首页接口 */ class Index extends Api { …

pytorch卸载cuda+cudnn并重新配置GPU环境,亲测有效

pytorch卸载cudacudnn 一、卸载cuda 进入【控制面板】&#xff0c;点击【卸载程序】 将红色框中带版本号的都卸载 二、删除cudnn配置 1、进入安装路径 将以下版本号文件直接删除 pytorch配置GPU环境 一、查看支持的cuda最高版本 1、winr&#xff0c;输入cmd&#xf…

UbuntuServer22.04配置静态IP地址

查看网络配置文件 使用命令, 查看网络配置文件 ls -l /etc/netplan/输出如下(文件名可能不同&#xff0c; 以实际查询为准) -rw------- 1 root root 191 Mar 17 03:30 00-installer-config.yaml编辑文件即可修改网络配置 sudo vim /etc/netplan/00-installer-config.yaml配…

【开源】SpringBoot框架开发二手车交易系统

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 二手车档案管理模块2.3 车辆预约管理模块2.4 车辆预定管理模块2.5 车辆留言板管理模块2.6 车辆资讯管理模块 三、系统设计3.1 E-R图设计3.2 可行性分析3.2.1 技术可行性分析3.2.2 操作可行性3.2.3 经济…

自然语言处理概念及发展

自然语言处理&#xff1a;概念、技术发展与应用 一、自然语言处理的概念 自然语言处理&#xff08;NLP&#xff0c;Natural Language Processing&#xff09;是人工智能领域的一个重要分支&#xff0c;旨在让计算机理解和生成人类日常使用的自然语言。NLP的研究范围广泛&…

单片机原理

AT89S51单片机片内硬件结构 &#xff08; 本节以AT89S51为例介绍51单片机的基本结构&#xff0c;如下图所示&#xff09; AT89S51单片机的片内结构&#xff0c;从图中可见 AT89S51单片机的基本组成&#xff1a; 1. CPU&#xff1a;8位的CPU 由控制器和运算器构成 2. 数据存…

【Frida】04_Frida中使用TypeScript脚本(采坑)

▒ 目录 ▒ &#x1f6eb; 导读需求开发环境演示目标 1️⃣ 操作步骤安装node 20.10.0在 VSCode 中打开项目目录初始化一个 NodeJS 项目安装 TypeScript初始化 TypeScript 项目安装依赖配置 TypeScript编写代码编译设置编译脚本运行&#xff0c;查看结果 2️⃣ 采坑frida-compi…

WEB前端项目开发——(一)(2024)

目录 1 通过Git Bash安装 vue-cli 2 创建项目 3 解决Git Bash方向键失效 4 重新进行项目创建 5 浏览器输入地址查看 6 案例——简单修改v3-calendar中的内容 7 测试页面效果 本篇文章介绍通过了Git Bash创建v3-calendar项目&#xff0c;之后对v3-calendar进行简单…

使用gitee自动备份文件

需求 舍友磁盘前两天gg了&#xff0c;里面的论文没有本地备份&#xff0c;最后费劲巴拉的在坚果云上找到了很早前的版本。我说可以上传到github&#xff0c;建一个私人仓库就行了&#xff0c;安全性应该有保证&#xff0c;毕竟不是啥学术大亨&#xff0c;不会有人偷你论文。但是…

R语言:microeco:一个用于微生物群落生态学数据挖掘的R包,第四:trans_beta class

trans_beta class&#xff1a;利用trans_beta类可以变换和绘制beta分集的距离矩阵。该类中涉及到beta多样性的分析主要包括排序、群距、聚类和方差分析。我们首先使用PCoA显示排序。 > dataset$cal_betadiv() The result is stored in object$beta_diversity ... > t1 &…

ClickHouse中的设置的分类

ClickHouse中的各种设置 ClickHouse中的设置有几百个&#xff0c;下面对这些设置做了一个简单的分类。

游戏引擎中网络游戏的基础

一、前言 网络游戏所面临的挑战&#xff1a; 一致性&#xff1a;如何在所有的主机内都保持一样的表现可靠性&#xff1a;网络传输有可能出现丢包安全性&#xff1a;反作弊&#xff0c;反信息泄漏。多样性&#xff1a;不同设备之间链接&#xff0c;比如手机&#xff0c;ipad&a…

C到C++的敲门砖-2

文章目录 引用内联函数auto关键字基于范围的for循环指针空值nullptr后记 引用 引用不是新定义一个变量&#xff0c;而是给已存在变量取了一个别名&#xff0c;编译器不会为引用变量开辟内存空 间&#xff0c;它和它引用的变量共用同一块内存空间。 所谓引用就是给变量起别名&am…

OpenAI的ChatGPT企业版专注于安全性、可扩展性和定制化。

OpenAI的ChatGPT企业版&#xff1a;安全、可扩展性和定制化的重点 OpenAI的ChatGPT在商业世界引起了巨大反响&#xff0c;而最近推出的ChatGPT企业版更是证明了其在企业界的日益重要地位。企业版ChatGPT拥有企业级安全、无限GPT-4访问、更长的上下文窗口以及一系列定制选项等增…

蓝桥杯算法

1&#xff0c;枚举&#xff08;买股票&#xff09; 买卖股票的最佳时机 小算是一个“优秀又不甘平庸的韭菜”&#xff0c;想要在股票市场上大赚一笔。这天小算又看中了一只潜力股。现在已知这只股票在n天内的价格为P0&#xff0c;P1&#xff0c;....&#xff0c;Pn-1&#xff…

ArrayList和LinkedList的区别,以及应用场景

ArrayList和LinkedList都是Java中的集合类&#xff0c;用于存储和操作一组对象。它们的主要区别在于内部实现方式和对操作的影响。 内部实现方式&#xff1a; ArrayList使用数组作为内部的数据结构&#xff0c;可以随机访问元素。当需要插入或删除元素时&#xff0c;ArrayList需…

RUST egui体验

egui官方提供了web版的demo&#xff0c;效果还是很不错的&#xff0c;就是用的时候有点一头雾水&#xff0c;没有找到明确的指导怎么把这些组件插入到自己的application或者web。花了一天时间撸了一遍流程&#xff0c;记录一下&#xff0c;说不定以后能用到呢 >_< efram…

asp.net 作业星软件系统

asp.net 作业星软件系统 用户功能:分教师和家长&#xff08;学生) 注册登录:登录部分是用户名密码&#xff0c;以及教师和家长&#xff08;学生&#xff09;的勾选; 注册包括用户名密码确认密码再次确认密码(与上方输入的密码比对&#xff09;身份班级设置找回账号的问题和答案…

【人工智能】英文学习材料01(每日一句)

&#x1f33b;个人主页&#xff1a;相洋同学 &#x1f947;学习在于行动、总结和坚持&#xff0c;共勉&#xff01; 目录 1.Natural Language Processing&#xff0c;NLP&#xff08;自然语言处理&#xff09; 2.Machine Learing&#xff0c;ML&#xff08;机器学习&#xf…

C#学习路线指南

C#新手学习路线指南 - 简书 https://www.cnblogs.com/yunbrody/p/17534310.html 第一部分&#xff1a;面向对象C#基础知识 1.C#开发入门 认识.NET平台与C#语言、理解.NET Framework框架、编写一个简单的C#程序并理解、C#程序的编译运行原理、VS常用开发环境设置&#xff08…