如何使用这个现有的JS代码示例基于数据属性查找元素?

Poulokopri

我想定位一个指定的div,但是现在我的示例仅在它具有ID的情况下。我想使用纯Javascript

当前的:

<div id="my_id">hello</div>

<script>
document.getElementById('my_id').insertAdjacentHTML('beforebegin',
    '<h3>text</h3>');
</script>

我的情况:

<div data-foo="bar">hello</div>
<div data-foo="club">hi</div>

如何定位具有bardata-foo属性的div

编码阴谋

您可以querySelector旁边使用属性选择器进行此操作

document.querySelector("div[data-foo='bar']").insertAdjacentHTML('beforebegin',
'<h3>text</h3>');
<div data-foo="bar">hello</div>
<div data-foo="club">hi</div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何获取现有的Hive表的SerDe属性

来自分类Dev

如何向现有的Winforms控件添加属性

来自分类Dev

AngularJS:如何基于数据属性值查找元素?

来自分类Dev

如何扩展现有的自定义元素?

来自分类Dev

如何修改元素中现有的<content>?

来自分类Dev

如何为新的面板类重复使用现有的布局代码?

来自分类Dev

如何快速使用现有的SQLite数据库?

来自分类Dev

如何将数组的新属性添加到现有的json数据

来自分类Dev

如何从现有的MongoDB数据库获取数据?

来自分类Dev

给定源代码,如何使用CFFI调用现有的C函数?

来自分类Dev

如何使用TSQL向现有的根XML节点添加属性?

来自分类Dev

如何更改现有的Atom.io代码段

来自分类Dev

如何基于键值项列表更新现有的嵌套对象属性

来自分类Dev

如何在jupyterhub页面中使用python-selenium查找现有的HTML元素?

来自分类Dev

如何使用AWS CDK查找现有的ApiGateway

来自分类Dev

如何使用AWS CDK查找现有的ApiGateway

来自分类Dev

如何基于两个数据属性值查找元素?

来自分类Dev

如何在Android下重用现有的Qt代码?

来自分类Dev

如何通过dom元素访问现有的地图对象?

来自分类Dev

使用现有的php代码重新创建数据库

来自分类Dev

我的React js代码如何与现有的Obj-C逻辑进行交互?

来自分类Dev

如何使用Snap.svg操作现有的组元素

来自分类Dev

如何使用基于数据属性的jQuery显示元素

来自分类Dev

如何使用现有的源代码在Eclipse中进行集成?

来自分类Dev

如何改善我现有的GetOpenfile函数代码

来自分类Dev

给定源代码,如何使用CFFI调用现有的C函数?

来自分类Dev

如何从现有的HTML模板代码创建Wordpress菜单?

来自分类Dev

js/jquery - 如何从 iframe 内部更改现有的 iframe 属性

来自分类Dev

如何使用代码中的新螺栓更新现有的 Storm 拓扑?

Related 相关文章

  1. 1

    如何获取现有的Hive表的SerDe属性

  2. 2

    如何向现有的Winforms控件添加属性

  3. 3

    AngularJS:如何基于数据属性值查找元素?

  4. 4

    如何扩展现有的自定义元素?

  5. 5

    如何修改元素中现有的<content>?

  6. 6

    如何为新的面板类重复使用现有的布局代码?

  7. 7

    如何快速使用现有的SQLite数据库?

  8. 8

    如何将数组的新属性添加到现有的json数据

  9. 9

    如何从现有的MongoDB数据库获取数据?

  10. 10

    给定源代码,如何使用CFFI调用现有的C函数?

  11. 11

    如何使用TSQL向现有的根XML节点添加属性?

  12. 12

    如何更改现有的Atom.io代码段

  13. 13

    如何基于键值项列表更新现有的嵌套对象属性

  14. 14

    如何在jupyterhub页面中使用python-selenium查找现有的HTML元素?

  15. 15

    如何使用AWS CDK查找现有的ApiGateway

  16. 16

    如何使用AWS CDK查找现有的ApiGateway

  17. 17

    如何基于两个数据属性值查找元素?

  18. 18

    如何在Android下重用现有的Qt代码?

  19. 19

    如何通过dom元素访问现有的地图对象?

  20. 20

    使用现有的php代码重新创建数据库

  21. 21

    我的React js代码如何与现有的Obj-C逻辑进行交互?

  22. 22

    如何使用Snap.svg操作现有的组元素

  23. 23

    如何使用基于数据属性的jQuery显示元素

  24. 24

    如何使用现有的源代码在Eclipse中进行集成?

  25. 25

    如何改善我现有的GetOpenfile函数代码

  26. 26

    给定源代码,如何使用CFFI调用现有的C函数?

  27. 27

    如何从现有的HTML模板代码创建Wordpress菜单?

  28. 28

    js/jquery - 如何从 iframe 内部更改现有的 iframe 属性

  29. 29

    如何使用代码中的新螺栓更新现有的 Storm 拓扑?

热门标签

归档