は、入力

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> 

私は最後に入力された入力を取得しようとしているに入りました。あなたは、あなたが空の値で入力要素を否定する:not()疑似クラスを使用することができ、属性値の選択をベースにする場合

Answer 1

を行うことができます。

セレクタは次のようになります。この場合：

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

そこから、あなたが一致するすべての要素を選択して、最後の1を取得することができます。

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 ANGE、あなたは、あなたが要素をフィルタリングする必要があるだろう、（むしろ属性値より）現在のプロパティ値に基づいてチェックしたい：サイドノートとして

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

---

、:last-child疑似クラスになるだけのリターンそれらの順序に基づいて親要素の最後の子要素を返します。選択した要素をフィルタしたり、属性やクラスによって最後のものを選択したりすることはありません。また、あなたが指摘したように、[value!=""]は有効な属性セレクタではありません。しかし、私は上記のようにinput[value]:not([value=""])を使用することができます。

Answer 2

あなたは、単にdocument.querySelector('.input-group input:last-child');