Форум

Aleksanderj · #1 (**permalink**) 08.05.2015, 17:11

Здравствуйте. Есть html:

<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/04c9993c2d.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст1">Текст</a>
  <div>
<div>
<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/0f99932c2d.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст2">Текст</a>
  <div>
<div>
<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/0fc92cd.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст3">Текст</a>
  <div>
<div>

Чтобы получить значение атрибута data-media-url в другую ссылку, которая находится в блоке control при помощи jquery есть:

$('.block').each(function() {
  var a = $(this).find('a')
  $(this).find('.link').attr('href', $(this).find('.listen_href').attr('data-media-url'))   
})

А как сделать тоже самое только при помощи javascript?

JsConAp · #2 (**permalink**) 08.05.2015, 17:37

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   <div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/04c9993c2d.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст1">Текст</a>
  <div>
<div>
<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/0f99932c2d.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст2">Текст</a>
  <div>
<div>
<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/0fc92cd.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст3">Текст</a>
  <div>
<div>

    <script>
          var block = document.querySelectorAll(".block");
  for (var i = 0; i < block.length; i++) {
      var link = block[i].querySelector(".link"),
          dataMediaAtribute = block[i].querySelector("a[data-media-url]"),
          attr = dataMediaAtribute.getAttribute("data-media-url");
      if (attr) {
          link.setAttribute("href", attr);
      }
  }
    </script>
</body>
</html>

Aleksanderj · #3 (**permalink**) 08.05.2015, 17:46

JsConAp,

спасибо большое! А как сделать, если у меня один блок:

<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/04c9993c2d.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст1">Текст</a>
  <div>
<div>

JsConAp · #4 (**permalink**) 08.05.2015, 17:54

Aleksanderj,
если я все правильно понял,то так

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<div class="block">
<a class="listen_href" data-media-url="http://mysite.ru/04c9993c2d.wav">
   </a>
  <div class="control">
<a class="link" alt="Текст1">Текст</a>
  <div>
<div>

    <script>
          var block = document.querySelector(".block"),
              link = block.querySelectorAll(".link"),
         dataMediaAtribute = block.querySelector("a[data-media-url]"),
          attr = dataMediaAtribute.getAttribute("data-media-url");
          for (var i = 0; i<link.length; i++) {
            link[i].setAttribute("href", attr);
          }
    </script>
</body>
</html>

Aleksanderj · #5 (**permalink**) 08.05.2015, 17:56

JsConAp, еще раз большое спасибо! С Днем Победы! ( у меня уже 9 мая )

Форум

Справочник

Discord чат

Курсы javascript