dom.querySelector和document.getElementById区别

dom.querySelector和document.getElementById区别、document.getElementById可以查询纯数字的iddom.querySelectordocument.querySelectorAll(’[id=“111”]’)在某个dom下寻找相应选择器的元素背景产品反馈项目系统模板复制之后,元素无法拖拽。经排查发现元素继承自move组件。而每个元素绑定的id竟然纯数字;复制模板之后由于项目的复杂性无法统一的对复制出…

大家好,又见面了,我是你们的朋友全栈君。

  1. document.getElementById

    可以查询纯数字的id

  2. dom.querySelector

    document.querySelectorAll(’[id=“111”]’)

    在某个dom下寻找相应选择器的元素

背景

产品反馈项目系统模板复制之后,元素无法拖拽。经排查发现元素继承自move组件。而每个元素绑定的id竟然纯数字;复制模板之后由于项目的复杂性无法统一的对复制出来的模板元素id进行更新。

问题

  1. 一个页面上有多个id相同的dom元素想要拖拽
  2. id为纯数字

解决

  1. 使用dom.queryselector()

    先获取需要拖拽元素的父元素dom,再在父元素中查询相应的dom;减少搜索范围,避免复制的id全页面不唯一无法定位的问题

  2. 如何查询dom

    1. 不更改dom的id

      使用dom.querySelectorAll(’[id=“111”]’)

    2. 更改domId符合规范(对元素的id进行dom+数字的方式进行赋值)

      使用dom.querySelectorAll(’#dom111’)

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/159599.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 方差分析法

    方差分析法前言工程实现的过程中需要对提取的特征指标进行有效性分析,评价各个特征指标与分类器不同类别的显著性关系,筛选出对不同类别判别贡献率最佳的指标,为设计分类器等提供支持。本文主要针对单因子方差分析法。实现步骤1.方差分析法的原理;2.数据准备;3.单因子方差分析法的matlab实现;4.特征的多重比较检验;实现过程1.方差分析法的原理;方差分析法(Analys…

    2022年10月16日
    0
  • STM32看门狗–窗口看门狗

    STM32看门狗–窗口看门狗stm32有两个看门狗,独立看门狗和窗口看门狗,其实两者的功能是类似的,只是喂狗的限制时间不同。 独立看门狗是限制喂狗时间在0-x内,x由你的相关寄存器决定。喂狗的时间不能过晚。窗口看门狗,所以称之为窗口就是因为其喂狗时间是一个有上下限的范围内,你可以通过设定相关寄存器,设定其上限时间和下限时间。喂狗的时间不能过早也不能过晚。图1&n…

    2022年5月30日
    24
  • 微信定位精灵 android,微信定位精灵安卓版下载「建议收藏」

    微信定位精灵 android,微信定位精灵安卓版下载「建议收藏」微信定位精灵安卓版下载是一款非常好用的位置伪装软件。可以让用户不会受任何地理位置的限制,也不需要担心自己被查岗的问题了,支持的软件也是很丰富的,定位也都是非常精准的。感兴趣的话就不要错过了,不妨来下载体验一下吧!微信定位精灵安卓版下载软件特色:1、可以让用户在被查岗的时候可以更加的有底气,就不需要担心这个了。2、这里可以让用户进行摇一摇切换微信位置,不需要切换到软件的界面。3、这里可以一键分享自己…

    2022年6月13日
    53
  • 实战篇-OpenSSL之AES加密算法-CFB1模式

    本文属于《OpenSSL加密算法库使用系列教程》之一,欢迎查看其它文章。实战篇-OpenSSL之AES加密算法-CFB1模式一、AES简介二、CFB1模式1、命令行操作2、函数说明3、编程实现(1)特别注意(2)实现CFB1模式加解密(3)测试代码一、AES简介密码学中的高级加密标准(AdvancedEncryptionStandard,AES),又称Rijndael加密法,是美国联邦政府采用的一种区块加密标准。这个标准用来替代原先的DES,已经被多方分析且广为全世界所使用。经过五年的甄选流程

    2022年4月9日
    123
  • 让框架的高度自适应

    让框架的高度自适应

    2021年9月10日
    50
  • layui 传递前端请求_layui弹出层如何传值

    layui 传递前端请求_layui弹出层如何传值layui弹出层传值的实现方法:1、从主窗口传值到弹出层;2、从弹出层传值到主窗口;3、通过session互传;4、通过调用父窗口的函数从而获取到父窗口的值。本教程操作环境:Windows7系统、layui1.0版,该方法适用于所有品牌电脑。主要有两部分从主窗口传值到弹出层从弹出层传值到主窗口通过session互传通过调用父窗口的函数从而获取到父窗口的值(相反也是可以的)1、从主窗口传值到弹出层首…

    2022年6月6日
    152

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号