■Before
<select> <option id="test0" value="">▼ 選択してね!</option> <option id="test1" value="1">A</option> <option id="test2" value="2">B</option> <option id="test3" value="3">C</option> </select>
■例えばこんな感じで、hidden属性を追加
document.getElementById('test0').setAttribute('hidden','hidden'); document.getElementById('test2').setAttribute('hidden','hidden');
■After
<select> <option id="test0" hidden="hidden" value="">▼ 選択してね!</option> <option id="test1" value="1">A</option> <option id="test2" hidden="hidden" value="2">B</option> <option id="test3" value="3">C</option> </select>
■結果
・すでに表示されている「▼ 選択してね!」は表示されたまま
・選択値を変更しようとすると「▼ 選択してね!」と「B」は表示されない
・ただし選択値の変更を確定しないと「▼ 選択してね!」に戻る
・一度選択値の変更を確定すると「▼ 選択してね!」は表示されない