How to select all the HTML elements having a custom attribute?

Question

I know I can select all the HTML elements with a custom attribute by just doing:

$('p[mytag]')

As you can see, I also need to specify the actual HTML div type (a p element in this case). But what if I need to retrieve all the HTML elements irrespective of their type?

Consider this code:

<p>11111111111111</p>
<p mytag="nina">2222222222</p>
<div>33333333333</div>
<div mytag="sara">4444444444</div>

how I can select the 2 html elements (the p and the div) with custom attribute mytag?

@gugateider that actually only selects the first element with the custom tag, not all — Danmoreng, Jul 30 '19 at 15:37
@Danmoreng No, that's incorrect. `$('[mytag]')` will select them all — j08691, Jul 30 '19 at 15:42
Interesting...must be a bad jQuery implementation of webpack/babel on the site I've tested it then... — Danmoreng, Jul 30 '19 at 15:46
@Danmoreng probably you are incorrectly using the subsequent foreach: it sholud be $("[mytag]").each(function(i, obj){ // do something with obj } — Gianluca Ghettini, Jul 30 '19 at 15:53
I got fooled by taking this for jQuery... https://stackoverflow.com/questions/22244823/what-is-the-dollar-sign-in-javascript-if-not-jquery — Danmoreng, Jul 31 '19 at 08:26

score 2 · Accepted Answer · answered Jul 30 '19 at 15:36

You just need to use $("[mytag]")

console.log($("[mytag]"))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>11111111111111</p>
<p mytag="nina">2222222222</p>
<div>33333333333</div>
<div mytag="sara">4444444444</div>

score 2 · Answer 2 · answered Jul 30 '19 at 15:38

2

Use querySelectorAll (javascript) :

document.querySelectorAll('[mytag]');

Or even simpler with jQuery:

$('[mytag]');

answered Jul 30 '19 at 15:38

Rafael Duarte

569
6
21

`$('[mytag]');` only selects the first element. `document.querySelectorAll('[mytag]');` works though. – Danmoreng Jul 30 '19 at 15:40
@Danmoreng No, that's incorrect. `$('[mytag]')` will select them all – j08691 Jul 30 '19 at 15:41
I got fooled by taking this for jquery... https://stackoverflow.com/questions/22244823/what-is-the-dollar-sign-in-javascript-if-not-jquery – Danmoreng Jul 31 '19 at 08:26

How to select all the HTML elements having a custom attribute?

2 Answers2