jQuery代碼的JavaScript等效物

Question

有人可以幫助什麼是下面的jQuery線的JavaScript等價物。

$("#abc option[value='1']").text(); 

ABC是選擇框的id

Answer 1

var options = document.getElementById("abc").options; 
for (var i = 0, j = options.length; i < j; i++) { 
    if (options[i].value == "1") { 
     alert(options[i].text); 
    } 
} 

的value和text屬性都可以在每HTMLOptionElement DOM級別2.

（demo）

---

向上日期
Updated demo與合併文本，比較。評論：

var options = document.getElementById("abc").options, 
    text = ""; 

for (var i = 0, j = options.length; i < j; i++) { 
    if (options[i].value == "1") { 
     text += options[i].text; 
    } 
} 

Answer 2

這將等同於選擇100％：

var options = document.getElementById('abc').getElementsByTagName('option'), 
    text = ""; 

for(var i = 0, l = options.length; i < l; i++) { 
    var option = options[i]; 
    if(option.value === '1') { 
     text += option.text; 
    } 
} 

或者，如果querySelectorAll可用：

var options = document.querySelectorAll('#abc option[value="1"]'), 
    text = ""; 
for(var i = 0, l = options.length; i < l; i++) { 
    text += options[i].text; 
} 

這就是說，你可以依賴於HTML改進結構（例如，如果#abc是選擇元素等）。

Answer 3

聲明沒有意義。它從選項中獲取文本，然後將其扔掉。我假設你想對文本做些什麼，比如將它分配給一個變量。

// A variable for the result 
var text = null; 

// Get the options from the select element 
var options = document.getElementById('abc').options; 

// Find the option with the value "1" 
for (var i = 0; i < options.length; i++) { 
    if (options[i].value == '1') { 
    // Get the text from the option 
    text = options[i].text; 
    // Exit from the loop 
    break; 
    } 
} 

注：原代碼將得到與指定的值的所有選項的文本，但是這個代碼僅會從找到的第一個選項的文本。擁有多個具有相同值的選項非常沒用，因此原始代碼的功能很可能是無意的。

Answer 4

在現代瀏覽器中，可以這樣：

var option = document.querySelector('#abc option[value="1"]').textContent 

Answer 5

這會工作。

document.querySelector(".producer option[value='1']").text;