Скрыть все блоки div по условию
Здравствуйте, помогите пожалуйста решить проблему. Постоянно приходиться долго прокручивать страницу чтобы добраться до определенного блока.
Нужно скрыть все блоки div class="item" имеющие внутри блок div class="item__status" который не содержит тег span. Внутри блока div class="item" не один блок div - это я урезал пример для наглядности. Букмарклет из Javascript сделать смогу. Код:
<div class="item" data-item="666" data-item-id="8336528" data-sale="true" data-count="1"> |
var elem = document.querySelectorAll('.item')
for(var i = 0, el;; i < elem.length; i++) {
(el = elem[i].querySelector('.item_status')) && (!el.querySelector('span')) && elem[i].display.style = 'none';
}
|
Мои 5копеек... :)
<!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>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
$('.item > .item__status').filter(function(){
return $(this).find('span').length!=0;
}).each(function(){
$(this).parent().hide();
});
});
</script>
</head>
<body>
<div class="item" data-item="666" data-item-id="8336528" data-sale="true" data-count="1">
<div class="item__status">
<span class="icon icon-lock-scratch">span_0</span>
</div>
</div>
<div class="item" data-item="689" data-item-id="8330595" data-sale="true" data-count="1">
<div class="item__status">no_span_0</div>
</div>
<div class="item" data-item="674" data-item-id="8248010" data-sale="true" data-count="1">
<div class="item__status">
<span class="icon icon-lock-scratch">span_1</span>
</div>
</div>
</body>
</html>
|
Цитата:
<!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>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
$('.item > .item__status').each(function(){
$(this).find('span').parents('.item').hide();
});
});
</script>
</head>
<body>
<div class="item" data-item="666" data-item-id="8336528" data-sale="true" data-count="1">
<div class="item__status">
<span class="icon icon-lock-scratch">span_0</span>
</div>
</div>
<div class="item" data-item="689" data-item-id="8330595" data-sale="true" data-count="1">
<div class="item__status">no_span_0</div>
</div>
<div class="item" data-item="674" data-item-id="8248010" data-sale="true" data-count="1">
<div class="item__status">
<span class="icon icon-lock-scratch">span_1</span>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
</head>
<body>
<div class="item" data-item="666" data-item-id="8336528" data-sale="true" data-count="1">
<div class="item__status">
<span class="icon icon-lock-scratch">span_0</span>
</div>
</div>
<div class="item" data-item="689" data-item-id="8330595" data-sale="true" data-count="1">
<div class="item__status">no_span_0</div>
</div>
<div class="item" data-item="674" data-item-id="8248010" data-sale="true" data-count="1">
<div class="item__status">
<span class="icon icon-lock-scratch">span_1</span>
</div>
</div>
<script>
[].forEach.call( document.querySelectorAll('.item > .item__status'), function(el) {
el.querySelector('span') && (el.parentNode.style.display = "none");
});
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 04:19. |