hello,你知道获取元素有哪几种方式吗？

最新推荐文章于 2023-02-06 11:46:48 发布
最新推荐文章于 2023-02-06 11:46:48 发布
阅读量222 收藏
点赞数
原文链接：https://juejin.im/post/5cd51476e51d456e2d69a847
版权

收下我的小心心！（害羞脸）

  • 根据id属性的值获取元素，返回来的是一个元素对象

    document.getElementById("id属性的值")

  • 根据标签名获取元素，返回来的是一个伪数组，里面保存了多个的DOM对象

    document.getElementsByTagName("标签名字")

  • 根据name属性的值获取元素(主要针对表单元素)，返回来的是一个伪数组，里面保存了多个的DOM对象

    document.getElementsByName("name属性的值")

  • 根据类样式的名字来获取元素，返回来的是一个伪数组，里面保存了多个的DOM对象

    document.getElementsByClassName("类样式的名字")

  • 根据选择器获取元素，返回来的是一个元素对象

    document.querySelector("选择器的名字")

  • 根据选择器获取元素，返回来的是一个伪数组，里面保存了多个的DOM对象

    document.querySelectorAll("选择器的名字")

以上只是我自己的学习总结，请各位大佬多多指教

复制代码

转载于:https://juejin.im/post/5cd51476e51d456e2d69a847

weixin_33730836
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js-字符串截取的几种方法
liunianweimo的博客
10-18 1007
截取字符串的使用是比较广泛的，在js的学习中整理了几个方法： split() 方法          substr()方法 substring()方法 1.split()方法      定义和用法      split()方法用于把一个字符串分割成字符串数组      语法      stringObject.split(separator,howmany)    参数...
HTML第六章课后作业4
qq_36074043的博客
10-22 1296
商品分类列表 ul{width:300px; border-width:thin; border-style:solid; border-color:#F93; list-style-type: none; line-height:40px; text-align:1em; font-weight:bold;} li{ border-bottom-color:#999999; border
jquery获取元素方式
稻草人技术博客
06-02 571
1 从集合中通过指定的序号获取元素 html：   0 1 2 3 4 5 6 7   js: jQuery(function(){ $("p").eq(2).css("color","red"); $("p").eq(3).css("color","red"); })  2 获取指定条件一致和指定范围的元素 html:
jquery中获取元素的几种方式小结
u012102536的博客
06-07 2445
1 从集合中通过指定的序号获取元素  html：  复制代码代码如下:   0  1  2  3  4  5  6  7    JS  复制代码代码如下:   jQuery(function(){  $("p").eq(2).css("color","red");  $("p").eq(3).css("color","red");
DOM获取元素的几种方式
小黑黑的博客
08-08 1318
DOM 1、可以通过id来获取元素 document.getElementById(); 在代码中比如你好 此时就能够获取id为box的元素信息，且在控制台将 你好 输出 同时也可以通过innerHTML来改变box元素里的内容。 a.innerHTML = ‘hello’;此时页面上显示的为 hello。 2、document.getElementByClassName()是通过获取class...
京东一面：20种异步，你知道几种？ 含协程
架构师尼恩
02-06 5889
调用方在调用过程中，持续阻塞，一直到返回结果。同步获取结果的方式是： 主动等待。调用方在调用过程中，不会阻塞， 不直接等待返回结果， 而是执行其他任务。异步获取结果的方式是 ： 被动通知或者 被动回调。1、定义发送事件对象2、定义事件监听器可以添加条件condition，限制监听具体的事件try {// 休眠5秒 TimeUnit . SECONDS . sleep(5);} }3、定义发送接口以及实现类entity . setMsg("新用户注册同步调用");} }
vue 获取元素额外生成的data-v-xxx操作
10-14
在Vue组件中，如果父组件中的样式要应用到子组件的元素上，有几种方法可以实现。默认情况下，父组件的样式不会渗透到子组件中。但若父组件希望调整其子组件根元素的样式，可以在子组件根节点上应用父组件的样式。 ...
关于Python 常用获取元素 Driver 总结
09-18
本文将总结几种Python中常用的元素获取方法，以及与之相关的Driver使用方法，包括环境配置、时间处理、编码处理和驱动文件的依赖等。 1. 环境配置 在开始之前，我们需要确保Python环境已经正确安装并配置了环境变量...
JavaScript中利用jQuery绑定事件的几种方式小结
10-22
本文将介绍几种在JavaScript中利用jQuery库来绑定事件的方法，同时也包括在不使用jQuery的情况下，利用纯JavaScript实现事件绑定的方式。 ### 1. 使用jQuery绑定事件 #### 方法一：直接使用jQuery对象的事件方法 ...
vue基本使用--refs获取组件或元素的实例
10-16
ref是一个非常有用的属性，它提供了一种方式，允许我们直接访问子组件实例或DOM元素。通常情况下，当你尝试访问子组件中的方法或数据时，应当依赖Vue.js的数据流和组件通信机制。但在某些特定的场景下，你可能需要...
仅用六种字符来完成Hello World，你能做到吗？
程序猿DD
11-05 3383
Hello World 对于每一个开发者来说都不陌生，因为在我们学习任何一个语言或框架的时候，都会有一个Hello World的案例来帮助我们快速入门。 如果我们使用JavaScript来输出Hello World的话，可以这样写： alert("Hello World"); 放入HTML： <html> <script type="text/javascript"> alert("Hello World");
DOM获取页面的元素
qq_41985556的博客
05-28 287
通过DOM获取页面的元素的三种方式1. getElementById( )方法访问DOM元素  —》 id获取一个元素2. getElementsByName( )方法访问DOM元素—》 元素的name属性名获取(数组)3. getElementsByTagName( )方法访问DOM元素 –》元素的名称获取(数组)4. getElementsByClassName()方法访问DOM元素 –》类样...
简历-求职简历-word-文件-简历模版免费分享-应届生-高颜值简历模版-个人简历模版-简约大气-大学生在校生-求职-实习
08-25
简历-求职简历-word-文件-简历模版免费分享-应届生-高颜值简历模版-个人简历模版-简约大气-大学生在校生-求职-实习 简历是展示个人经历、技能和能力的重要文档，以下是一个常见的简历格式和内容模板，供您参考： 简历格式： 头部信息：包括姓名、联系方式（电话号码、电子邮件等）、地址等个人基本信息。 求职目标（可选）：简短描述您的求职意向和目标。 教育背景：列出您的教育经历，包括学校名称、所学专业、就读时间等。 工作经验：按时间顺序列出您的工作经历，包括公司名称、职位、工作时间、工作职责和成就等。 技能和能力：列出您的专业技能、语言能力、计算机技能等与职位相关的能力。 实习经验/项目经验（可选）：如果您有相关实习或项目经验，可以列出相关信息。 获奖和荣誉（可选）：列出您在学术、工作或其他领域获得的奖项和荣誉。 自我评价（可选）：简要描述您的个人特点、能力和职业目标。 兴趣爱好（可选）：列出您的兴趣爱好，展示您的多样性和个人素质。 参考人（可选）：如果您有可提供推荐的人员，可以在简历中提供其联系信息。 简历内容模板： 姓名: 联系方式: 地址: 求职目标: （简短描述您的求职意
JAVA版基于netty的物联网高并发智能网关
08-25
JAVA版基于netty的物联网高并发智能网关
粮食波动率等相关农业数据（2011-2022）（全新整理）
08-25
1、资源内容地址：https://blog.csdn.net/2301_79696294/article/details/141441802 2、代码特点：今年全新，手工精心整理，放心引用，数据来自权威，相对于其他人的控制变量数据准确很多,适合写论文做实证用 ，不会出现数据造假问题 3、适用对象：大学生，本科生，研究生小白可用，容易上手！！！ 3、课程引用: 经济学，地理学，城市规划与城市研究，公共政策与管理，社会学，商业与管理 数据内容： 1.人均粮食产量 2.粮食总产量 3.粮食产量波动率（（当年粮食产量-历年粮食产量均值）/均值）：粮食生产受自然因素和市场等经济社会因素影响较大，常常表现出一定的波动。粮食产量波动率是衡量粮食生产稳定能力的重要指标之一。粮食产量波动率 Rt＝（Yt−Yt＇）／Yt＇，其中 Yt表示 t 年粮食总产量，Yt＇ 表示粮食产量 5 年移动平均值。 4.粮食播种面积 5.粮食单位面积产量 6.谷物/非谷物产量 7.秋收/夏收粮食产量 8.粮食进口数量 9.粮食进口金额 10.粮食出口金额 11.粮食外贸依存度（粮食进出口总额/农业
基于微信小程序高校寻物平台设计与实现.docx
08-25
基于微信小程序高校寻物平台设计与实现.docx
ant-design-3.20.3.zip
最新发布
08-25
ant-design，一套企业级 UI 设计语言和 React 组件库 提炼自企业级中后台产品的交互语言和视觉风格 开箱即用的高质量 React 组件
uniapp 获取元素节点
05-16
在 `uniapp` 中，获取元素节点有多种方式，以下是其中几种常见的方法： 1. 使用 `uni.createSelectorQuery()` 方法获取元素节点，示例代码如下： ```javascript uni.createSelectorQuery().select('.my-element').boundingClientRect(function(rect){ console.log(rect) }).exec(); ``` 其中，`.my-element` 是需要获取的元素节点的 `class` 名称，`boundingClientRect` 方法可以获取元素节点的位置、大小等信息。 2. 使用 `uni.$refs` 获取元素节点，示例代码如下： ```html <view ref="myElement" class="my-element">Hello World</view> ``` ```javascript this.$nextTick(() => { const element = this.$refs.myElement.$el; console.log(element) }) ``` 其中，`ref` 属性用于标识需要获取的元素节点，`$nextTick` 方法可以确保元素节点已经渲染完成。 3. 使用 `document.querySelector()` 方法获取元素节点，示例代码如下： ```javascript const element = document.querySelector('.my-element'); console.log(element) ``` 其中，`.my-element` 是需要获取的元素节点的 `class` 名称，需要注意的是，`document.querySelector()` 方法只能在 `web` 端使用，不能在 `uniapp` 的小程序、App 等场景中使用。 以上是 `uniapp` 中获取元素节点的几种常见方法，具体使用方法可以根据实际场景选择合适的方式。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值