Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Помощь с js и DOM (https://javascript.ru/forum/misc/77062-pomoshh-s-js-i-dom.html)

rafchikcv 20.03.2019 20:53
Помощь с js и DOM
 
<div class='module'>
<div class='ololo'>
<h3 color='white'> 
<i class='module-actions-icon'></i>Fortnite</h3>
<div>
<img  id= "fortphoto" alt = "КупитьFortnite"onclick = "window.location=''" src=""></div></div></div>	
	

<div class='module'>
<div class='ololo'>
<h3 color='white'> <i class='module-actions-icon'></i>CS:GO</h3> 
<div>
<img  id= "csgophoto" alt = "Купить CS:GO"onclick = "window.location=''" src=""></div></div></div>



На странице есть множество классов с именем module. Помогите найти именно эти два по id img. Заранее благодарен.

рони 20.03.2019 21:18
rafchikcv,
<!DOCTYPE html>

<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    .red {
        background-color: #FF0000;
         color: #FFFFFF;
    }

    </style>

</head>

<body>
 <div class='module'>
 <div class='ololo'>
 <h3 color='white'>
 <i class='module-actions-icon'></i>Fortnite</h3>
 <div>
 <img id= "fortphoto" alt = "КупитьFortnite"onclick = "window.location=''" src=""></div></div></div>


 <div class='module'>
 <div class='ololo'>
 <h3 color='white'> <i class='module-actions-icon'></i>CS:GO</h3>
 <div>
 <img id= "csgophoto" alt = "Купить CS:GO"onclick = "window.location=''" src=""></div></div></div>
    <script>
    let divs =  ["#fortphoto","#csgophoto"].map(id => [...document.querySelectorAll(".module")].filter(div => div.querySelector(id))[0]);
    divs.forEach(div => div.classList.add("red"))

    console.log(divs)
    </script>
</body>
</html>

рони 20.03.2019 21:19
rafchikcv,
[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

rafchikcv 20.03.2019 21:21
огромное спасибо!

Malleys 21.03.2019 09:38
Цитата:
Сообщение от рони 
let divs =  ["#fortphoto","#csgophoto"].map(id => [...document.querySelectorAll(".module")].filter(div => div.querySelector(id))[0]);

let divs = [...document.querySelectorAll(".module")].filter(node => node.querySelector("#fortphoto, #csgophoto"));

рони 21.03.2019 10:07
Цитата:
Сообщение от Malleys
querySelector("#fortphoto, #csgophoto")
такое даже в голову не пришло (множественный селектор, для одиночного поиска) :) :thanks:
а нет какого нибудь contains или matches для данного случая, что-то типа https://api.jquery.com/parents/ ?

Malleys 22.03.2019 08:00
В CSS Selectors Level 4 определён псевдо-класс has, который позволяет это сделать так...
let divs = [...document.querySelectorAll(".module:has(#fortphoto, #csgophoto)")];


https://caniuse.com/#feat=css-has однако нигде не реализовано

рони 22.03.2019 08:15
Malleys,
:thanks:

Alexandroppolus 22.03.2019 14:38
самый быстрый вариант:

var m1 = document.getElementById('fortphoto').closest('.module');
var m2 = document.getElementById('csgophoto').closest('.module');

рони 22.03.2019 14:48
Alexandroppolus,
:thanks:


Часовой пояс GMT +3, время: 06:16.
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице