찾기는 마지막으로 내가 마지막으로 입력 입력을 얻으려고 입력

Question

<div class="input-group"> 
    <input type="password" maxlength="1" value="1" readonly=""> 
    <input type="password" maxlength="1" value="2" readonly=""> 
    <input type="password" maxlength="1" value="3" readonly=""> 
    <input type="password" maxlength="1" value="" readonly=""> 
</div> 

에 들어갔다. 당신은 속성 값의 선택을 기반으로하고 싶다면 당신은 단순히 document.querySelector('.input-group input:last-child');

Answer 1

을 할 수

Answer 2

는, 당신은 빈 값으로 입력 요소를 부정하는 :not() 의사 클래스를 사용할 수 있습니다.

이 경우 선택기는 다음과 같습니다

input[value]:not([value=""]) 

이 거기에서, 마지막 하나를 일치하는 모든 요소를 ​​선택하고 검색 할 수 있습니다

var inputs = document.querySelectorAll('input[value]:not([value=""])'); 
var lastInputWithValue = inputs[inputs.length - 1]; 

... 나 :

을

var inputs = document.querySelectorAll('input[value]:not([value=""])'); 
var lastInputWithValue = Array.from(inputs).pop(); 

---

값이 ch ,

var inputs = document.querySelectorAll('input'); 
var lastInputWithValue = Array.from(inputs).filter(i => i.value).pop(); 

보조 노트로

---

:last-child 의사 클래스만이 수익을 : 플랜지 당신은, 다음의 요소를 필터링해야합니다 (대신 속성 값보다) 현재 속성 값을 기준으로 확인하려면 부모 요소의 내부에있는 마지막 자식 요소. 선택한 요소를 필터링하지 않고 원하는대로 특성 또는 클래스별로 마지막 요소를 선택합니다. 또한 [value!=""]은 잘못된 속성 선택기가 아닙니다. 그러나 위에서 지적한 것처럼 input[value]:not([value=""])을 사용할 수 있습니다.