javascript - 如何从 Id 中获取子字符串？

Question

我在下面的不同页面上有以下 <img> 元素。我怎样才能使用 javascript 获取所有 data-uuid 属性？

如果只有 1 个 <img> 元素或超过 1 个，它应该能够处理。

页面 foo:

$('[data-uuid]').on('click', function() {
 alert($(this).attr('data-uuid'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src='https://placeimg.com/200/200/animals' data-uuid='123'>
    <img src='https://placeimg.com/200/200/animals?t=1526063181645' data-uuid='456'>
    <img src='https://placeimg.com/200/200/animals?t=1526063190252' data-uuid='789'>

分页栏:

<img src='some-url-5' data-uuid=157>

Answer 1

querySelectorAll^MDN 和 Attribute selector :

let uuids = [...document.querySelectorAll("[data-uuid]")].map(el => 
    el.dataset.uuid
);

console.log( uuids )

<img src='some-url' data-uuid=123>
<img src='some-url1' data-uuid=456>
<img src='some-url2' data-uuid=789>

jQuery 版本:

var uuids = $("[data-uuid]").get().map(function(el) {
  return el.getAttribute("data-uuid");
});

console.log( uuids )

<img src='some-url' data-uuid=123>
<img src='some-url1' data-uuid=456>
<img src='some-url2' data-uuid=789>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>