Форум

Янковиц · #1 (**permalink**) 12.09.2017, 16:11

Добрый день. Есть разметка:

<div class="selectize-input">
    <div data-value="7" class="item">запись</div>
    <div data-value="5" class="item">контент</div>
    <div data-value="4" class="item">дабл тег</div>
</div>

Как разом получить следующую запись: 7, 5, 4
???
Количество элементов откуда нужно получить data-value - неизвестно.
Спасибо

И еще.. весь это блок создается динамически..

рони · #2 (**permalink**) 12.09.2017, 16:24

Янковиц,
код в строке 12 запустить после создания блока

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>

  <script>
window.addEventListener('DOMContentLoaded', function() {
  var data = [].map.call( document.querySelectorAll('[data-value]'), function(el) {
         return +el.dataset.value
  });
  alert(data);
    });
  </script>
</head>

<body>
 <div class="selectize-input">
    <div data-value="7" class="item">запись</div>
    <div data-value="5" class="item">контент</div>
    <div data-value="4" class="item">дабл тег</div>
</div>



</body>
</html>

Янковиц · #3 (**permalink**) 12.09.2017, 16:27

Спасибо. А можно на jQuery?

рони · #4 (**permalink**) 12.09.2017, 16:33

Сообщение от Янковиц

А можно на jQuery?

а зачем усложнять?

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
var data = $.map($("[data-value]"), function(el) {
  return $(el).data("value")
});
alert(data);
});
  </script>
</head>

<body>
<div class="selectize-input">
    <div data-value="7" class="item">запись</div>
    <div data-value="5" class="item">контент</div>
    <div data-value="4" class="item">дабл тег</div>
</div>

</body>
</html>

Янковиц · #5 (**permalink**) 12.09.2017, 16:41

Спасибо еще раз. У меня по соседству есть такой же блок с пунктами. Приведенный скрипт выводит все data-value из соседнего. Как конкретизировать div?

j0hnik · #6 (**permalink**) 12.09.2017, 16:50

$(function() {
var data = $.map($(".selectize-input [data-value]"), function(el) {
  return $(el).data("value")
});
alert(data);
});

Янковиц · #7 (**permalink**) 12.09.2017, 17:11

Почему-то пишет ошибку:
TypeError: $(...).data is not a function

рони · #8 (**permalink**) 12.09.2017, 17:18

Янковиц,
jQuery какая версия? хотя дело скорее не в версии, либо ошибки в коде, либо нет jQuery

Форум

Справочник

Discord чат

Курсы javascript