Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Заменить все атрибуты дочерних элементов на значение взятое у родителя (https://javascript.ru/forum/jquery/55949-zamenit-vse-atributy-dochernikh-ehlementov-na-znachenie-vzyatoe-u-roditelya.html)

chelkaz 22.05.2015 12:46
Заменить все атрибуты дочерних элементов на значение взятое у родителя
 
Подскажите простое решение пожалуйста. Как пробежаться по странице, И у всего что находиться в блоке с классом test заменить у img атрибут на тот который у тега a 

<div class="test">
<a href="url1">
<img src="old1" >
</a>
<a href="url2">
<img src="old2" >
</a>
<a href="url3">
<img src="old3" >
</a>
...
</div>


Должно получиться:

<div class="test">
<a href="url1">
<img src="url1" >
</a>
<a href="url2">
<img src="url2" >
</a>
<a href="url3">
<img src="url3" >
</a>
...
</div>


Я сделал так:

$('.offer-media__thumb').each(function () { 
            var res;
            res = $(this).attr('href');
            $('.offer-media__preview').each(function () {
            	$(this).attr('src', res);
            });            
            //alert(res);
        });


но первый url вставляется к последующим. То есть у всех получается один и тот же url (первый)

ksa 22.05.2015 13:10
Цитата:
Сообщение от chelkaz
Я сделал так
Двойной цикл тут не нужен. :)

Достаточно просто пройтись по всем дочерним ссылкам родительского элемента найти дочерний img и заменить у него значение атрибута на значение из текущей ссылки.

ksa 22.05.2015 13:14
Как вариант...

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="http://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.0/less.min.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
	$('.test > a').each(function(){
		$(this).children('img').attr('src',$(this).attr('href'));
	});
});
</script>
</head>
<body>
<div class="test">
	<a href="http://javascript.ru/forum/images/smilies/smile.gif">
		<img src="old1" />
	</a>
	<a href="http://javascript.ru/forum/images/smilies/wink.gif">
		<img src="old2" />
	</a>
	<a href="http://javascript.ru/forum/images/smilies/laugh.gif">
		<img src="old3" />
	</a>
</div>
</body>
</html>

chelkaz 22.05.2015 13:32
То что нужно, пишу просто небольшой парсер для яндекс недвижимости. И там что бы картинку достать нужно в стили исходника было лезть. Это очень долго. Вот и решил написать что бы после загрузки страницы превьюшки менялись на full

рони 22.05.2015 14:21
:write: 
this.children[0].src = this.href;

chelkaz 22.05.2015 14:52
Цитата:
Сообщение от рони (Сообщение 371919)
:write: 
this.children[0].src = this.href;
Это для этой задачи подходит по простоте. Но кажется с предыдущим вариантом можно удобнее фильтровать. Если например будут присутствовать не нужные img с определенным классом. Но для данной задачи Ваш вариант идентичен, но в два раза короче. Спасибо!


Часовой пояс GMT +3, время: 02:02.