JavaScript(15)——操作表单元素属性和自定义属性

 操作表单元素属性

  • 表单很多情况,也需要修改属性,比如点击眼睛可以看到密码,本质是把表单类型转换为文本框
  • 正常的有属性有取值的,跟其他的标签属性没有任何区别

获取:DOM对象.属性名

设置:DOM对象.属性名 = 新值

例如:获取输入文本框的信息

<body><input type="text" value="hhh1"><script>//获取元素const uname = document.querySelector('input')//获取值console.log(uname.value)//设置表单的值uname.value = 'new'//设置表单的属性uname.type = 'password'</script>
</body>

表单属性中添加就有效果,移除就没有效果,一律使用布尔值表示,如果为true代表添加了该属性,如果为false代表移除了该属性

比如:disabled、checked、selected

<input type="checkbox" name="" id=""><script>const op = document.querySelector('input')console.log(op.checked)</script>

op.checked = true 

 

自定义属性 

标准属性:标签自带的属性例如class,id,title,可以直接使用点语法操作比如:disabled,checked,selected。

自定义属性:

  • html5中推出了专门的data-自定义属性
  • 在标签上一律以data-开头
  • 在DOM对象一律以dataset对象方式获取

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

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

相关文章

Android adb shell ps进程查找以及kill

Android adb shell ps进程查找以及kill 列出当前Android手机上运行的所有进程信息如PID等&#xff1a; adb shell ps 但是这样会列出一大堆进程信息&#xff0c;不便于定向查阅&#xff0c;可以使用关键词查找&#xff1a; adb shell "ps | grep 关键词" 关键词查…

Jenkins详细使用教程

目录 1. 什么是Jenkins&#xff1f; 2. 为什么使用Jenkins&#xff1f; 3. 安装Jenkins 3.1 下载相关文件 3.2 解压Linux版本的JDK 3.3 配置JDK环境 3.4 运行jenkins.war 3.5 安装完成 4. 访问Jenkins 5. 修改密码 6. 集成JDK 7. Jenkins集成Git 7.1 使用Jenkins拉取…

C语言——运算符及表达式

C语言——运算符及表达式 运算符运算符的分类&#xff08;自增运算符&#xff09;、--&#xff08;自减运算符&#xff09;赋值运算符逗号运算符&#xff08;顺序求值运算符&#xff09; 表达式 运算符 运算符的分类 C语言的运算符范围很宽&#xff0c;除了控制语句和输入输出…

Internet Download Manager2024免费流行的下载加速器

1. Internet Download Manager&#xff08;IDM&#xff09;是一款流行的下载加速器&#xff0c;多线程下载使速度更快。 2. 用户界面友好&#xff0c;易于操作&#xff0c;支持多种浏览器集成和自动捕获下载。 3. 恢复中断的下载&#xff0c;动态文件分割技术提高效率。 4. 定…

Vue3与Element-plus配合 直接修改表格中的一项数据——控制输入框的显示与隐藏

利用控制与隐藏输入框,直接修改表格中的每一项数据。 <!-- 表格模块 --> <div><el-table :data"tablelist" style"width: 100%"><el-table-column align"center" prop"deposit" label"接单押金">&l…

『 Linux 』信号的写入与保存

文章目录 信号的发送信号的保存sigset_t 类型与信号集操作函数阻塞信号集(信号屏蔽字)操作函数未决信号集操作函数验证阻塞信号集与未决信号集 信号的发送 $ kill -l1) SIGHUP 2) SIGINT 3) SIGQUIT 4) SIGILL 5) SIGTRAP6) SIGABRT 7) SIGBUS 8) SIGFPE 9) SIGKILL 10)…

【音视频】RTSP、RTMP与流式传输

文章目录 前言RTSP与RTMPRTSP&#xff08;Real-Time Streaming Protocol&#xff09;RTMP&#xff08;Real-Time Messaging Protocol&#xff09;主要差异 什么是流式传输&#xff1f;流式传输的特点流式传输与传统下载的区别 使用VLC播放RTSP监控 总结 前言 在现代网络环境中…

一天搞定React(3)——Hoots组件【已完结】

Hello&#xff01;大家好&#xff0c;今天带来的是React前端JS库的学习&#xff0c;课程来自黑马的往期课程&#xff0c;具体连接地址我也没有找到&#xff0c;大家可以广搜巡查一下&#xff0c;但是总体来说&#xff0c;这套课程教学质量非常高&#xff0c;每个知识点都有一个…

学习笔记之Java篇(0726)

2、封装 1、封装的使用细节 2、开发中封装的简单规则&#xff1a; 属性一般使用private访问权限。 属性私有后&#xff0c;提供相应的get/set方法来访问相关属性&#xff0c;这些方法通常是public修饰后&#xff0c;以提供属性的赋值与读取操作&#xff08;注意&#xff1a;b…

情绪稳定的人有什么特点?

第一部分&#xff1a;至纯之人&#xff0c;大器晚成 1.1 单纯&#xff0c;不是天真 你知道吗&#xff1f;那些能够成就大事的人&#xff0c;往往在人性上非常单纯。他们对外界的需求很低&#xff0c;更多的是向内寻求。这样的人&#xff0c;他们的内心世界像一片净土&#xff…

二叉树 N0=N2+1

N0 叶子节点&#xff0c;度为 0 的节点&#xff1b; N1 度为 1 的节点&#xff1b; N2 度为 2 的节点 度为 0 的节点为&#xff1a;H、I、J、K、G 度为 1 的节点&#xff1a;E、F 度为 2 的节点&#xff1a;A、B、D、C N0 N2 1&#xff0c;即&#xff1a;度为 0 的叶子节点 …

力扣高频SQL 50 题(基础版)第四题

文章目录 力扣高频SQL 50 题&#xff08;基础版&#xff09;第四题584.寻找用户推荐人题目说明思路分析实现过程准备数据实现方式结果截图 力扣高频SQL 50 题&#xff08;基础版&#xff09;第四题 584.寻找用户推荐人 题目说明 表: Customer -------------------- | Colu…

虚拟机配置RabbitMQ集群教程

RabbitMQ是常用的一款消息中间件&#xff0c;那么如何在我们虚拟机中创建其集群呢&#xff1f;跟着博主这篇文章让你一步到位 本篇搭建的是三台机器为一个集群&#xff01;假设大家虚拟机都为初始化状态&#xff0c;从0开始&#xff08;注意集群搭建需要CentOS8以上环境&#x…

【五】MySql8基于m2芯片arm架构Ubuntu24虚拟机安装

文章目录 1. 更新系统包列表2. 安装 MySQL APT Repository3. 更新系统包列表4. 安装 MySQL Server5. 运行安全安装脚本6. 验证 MySQL 安装7. 配置远程连接7.1 首先要确认 MySQL 配置允许远程连接&#xff1a;7.2 重启 MySQL 服务&#xff1a;7.3 检查 MySQL 用户权限&#xff1…

详解数据结构之二叉树(二叉链,使用递归)

详解数据结构之二叉树(二叉链&#xff0c;使用递归实现) 二叉链 二叉链&#xff0c;二叉树的链式结构&#xff0c;其中数据域data存放节点的值&#xff0c;指针域left和right分别存放左孩子节点的地址、右孩子节点的地址。 typedef int BinaryTDataType; typedef struct Bin…

ChatGPT的原理和成本

ChatGPT就是人机交互的一个底层系统&#xff0c;某种程度上可以类比于操作系统。在这个操作系统上&#xff0c;人与AI之间的交互用的是人的语言&#xff0c;不再是冷冰冰的机器语言&#xff0c;或者高级机器语言&#xff0c;当然&#xff0c;在未来的十来年内&#xff0c;机器语…

K8S 部署peometheus + grafana 监控

安装说明 如果有下载不下来的docker镜像可以私信我免费下载。 系统版本为 Centos7.9 内核版本为 6.3.5-1.el7 K8S版本为 v1.26.14 动态存储&#xff1a;部署文档 GitHub地址 下载yaml 文件 ## 因为我的K8S 版本比较新&#xff0c;我下载的是当前的最新版本&#xff0c;你的要…

go语言day18 reflect反射

Golang-100-Days/Day16-20(Go语言基础进阶)/day19_Go语言反射.md at master rubyhan1314/Golang-100-Days (github.com) 7-19 接口&#xff1a;底层实现_哔哩哔哩_bilibili 一、interface接口 接口类型内部存储了一对pair(value,Type) type interface { type *Type // 类型信…

Linux:传输层(2) -- TCP协议(2)

目录 1. 流量控制 2. 滑动窗口 3. 拥塞控制 4. 延迟应答 5. 捎带应答 6. 面向字节流 7. 粘包问题 8. TCP异常情况 1. 流量控制 接收端处理数据的速度是有限的. 如果发送端发的太快 , 导致接收端的缓冲区被打满 , 这个时候如果发送端继续发送 , 就会造成丢包, 继而引…

7月24日JavaSE学习笔记

序列化版本控制 序列化&#xff1a;将内存对象转换成序列&#xff08;流&#xff09;的过程 反序列化&#xff1a;将对象序列读入程序&#xff0c;转换成对象的方式&#xff1b;反序列化的对象是一个新的对象。 serialVersionUID 是一个类的序列化版本号 private static fin…