Array.from : 원하는 조건을 배열로 만들어 준다.

 

🤍 각 NETWORK , WIRELESS , IPT 버튼 3개가 있다. 

🩶 버튼 클릭시 class="selected" 가 붙도록 로직을 구성했다.

🤍 name 명은 동일하다.

<button value="network" name="service-button">NETWORK </button>
<button value="wireless" name="service-button">WIRELESS </button>
<button value="ipt" name="service-button">IPT </button>

 

 

🤍 Array.from 을 통해 name 이  "service-button" 인걸 찾는다.

 let radio_buttons = Array.from(document.querySelectorAll('[name="service-button"]'))
    .filter(radio => radio.classList.contains("selected"))
    .map(radio => radio.value);

    console.log(radio_buttons);

 

🩶 필터를 두는데 각 배열의 아이템의 classList.contains 즉, 클래스가 selected 인 아이템을 찾는다.

🤍 map 을 이용해 반복문을 통해 selected 인 아이템의 value을 담아준다.

🩶 raido_buttons 를 console.log 로 찍어보면 class = "selected" 인 value 값이 나온다.