用於更改空白選項標簽文本的 Javascript

Question

我對javascript相當陌生，並試圖自己解決這個問題，但我對某些對象和屬性不熟悉。 我相信我下面的代碼可以用於更改文檔中的“所有”“選項”文本，但我只需要它來更改空選項標簽的文本值，例如； <option></option> ，到<option>Choose One</option> 。 我希望它在頁面加載時執行此操作，因為頁面是由 asp 動態生成的。

 <script type="text/javascript">
    function changeEmpty(){
      document.getElementByTagName('option')options[0].text='Choose One';
    }
    </script>

Answer 1

如果它將成為頁面上一個選擇的第一個選項，它將是

document.getElementsByTagName('option')[0].text='Choose One';

最好指定元素，這樣如果將來有人在它之前添加一個選擇，就無所謂了。

document.getElementById("MyId").getElementsByTagName('option')[0].text='Choose One';

Answer 2

“我需要它只更改空選項標簽的文本值......”

您的語法無效，所以我不確定為什么您認為它會更改所有option元素。

但是你可以做的只是簡單地迭代它們，並測試文本內容。

var opts = document.getElementsByTagName('option');

for (var i = 0, len = opts.length; i < len; i++) 
    if (opts[i].text === "")
        opts[i].text = "Choose One";

Answer 3

如果你真的想改變所有沒有內容的<option> ，你可以使用這個代碼

function changeEmpty(){
  var els = document.querySelectorAll( 'option' );

  for ( var i=els.length; i--; ) {
    if ( els.innerHTML.trim() == '' ) {
      els.innerHTML = 'choose one';
    }
  }
}

假設空的<option>將始終是每個<select>標簽中的第一個，更改為

var els = document.querySelectorAll( 'select > option' );

以節省一些計算。

編輯

所有現代瀏覽器都支持querySelectorAll() ，但不支持 IE7 和以前的版本！ 參見caniuse.com 。