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

选择和操作元素

上一篇文档我们介绍了DOM元素和DOM的获取;其实除了获取DOM,我们也可以去替换DOM元素中的文本

document.querySelector('.message').textContent = "🎉Correct Number"

在这里插入图片描述

● 除此之外,我们可以设置那个数字部分

document.querySelector('.message').textContent = '🎉Correct Number';
document.querySelector('.number').textContent = 13;
document.querySelector('.score').textContent = 16;

在这里插入图片描述

注:这样对照着HTML中的class看,可以更加容易看懂!

● 当然除了获取并修改DOM 的文本,我们也可以获取到输入框的值和修改输入框的值

console.log(document.querySelector('.guess').value);

在这里插入图片描述

因为输入框中没有任何的内容,所以我们什么都没有获取!当然我们可以给其赋值

console.log(document.querySelector('.guess').value);
document.querySelector('guess').value = 23;
console.log(document.querySelector('.guess').value);

在这里插入图片描述

但是如果我们需要点击那个CHeck!按钮之后,然后再去获取input的值该怎么做呢?这个按钮的点击时间我们将在下一节课再接着介绍!

http://www.lryc.cn/news/180821.html

相关文章:

  • 消息中间件(二)——kafka
  • 量化交易全流程(四)
  • idea 如何在命令行快速打开项目
  • YOLOV8-DET转ONNX和RKNN
  • 数量关系 --- 方程
  • 【C语言 模拟实现strlen函数的三种方法】
  • MySQL数据库与表管理《三国志》为例
  • D. Jellyfish and Mex - DP
  • 奥斯卡·王尔德
  • IDEA常用快捷键大全
  • Java之多线程的综合练习二
  • selenium下载安装 -- 使用谷歌驱动碰到的问题
  • 开放式耳机怎么选择、300之内最好的耳机推荐
  • git密码提交切换SSH提交
  • 数字乡村包括哪些方面?数字乡村应用介绍
  • 弹性资源组件elastic-resource设计(一)-架构
  • C/C++笔试面试真题
  • 【Vue3】兄弟组件传参
  • 【CSS 中 link 和@import 的区别】
  • 笔记二:odoo搜索、筛选和分组
  • Ubuntu Zookeeper开机自启动服务
  • 关于Matlab与Python中日期转时间戳不一致的问题
  • 【Django 笔记】第一个demo
  • 算法通过村第十一关-位运算|白银笔记|高频题目
  • 04、EL和JSTL核心技术
  • 【LeetCode热题100】--148.排序链表
  • 分布式并行训练(DP、DDP、DeepSpeed)
  • Linux- fg命令 bg命令
  • leetcode第362场周赛
  • 图神经网络GNN(一)GraphEmbedding