开发者

javascript equivalent of jquery code

Can someone help what's the javascript equivalent of below jquery line.

$("#a开发者_开发知识库bc option[value='1']").text();

abc is the id of selectbox


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);
    }
}

The value and text attributes are available on the HTMLOptionElement per DOM Level 2.

(demo)


UPDATE
Updated demo with combined text, cf. comments:

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;
    }
}


This would be 100% equivalent to the selector:

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;
    }
}

Or if querySelectorAll is available:

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

That said, you can make improvements depending on the HTML structure (e.g. if #abc is the select element etc).


In modern browsers it can be:

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


The statement doesn't make sense. It gets the text from an option, and then just throws it away. I assume that you want to do something with the text, like assigning it to a variable.

// 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;
  }
}

Note: The original code would get the text from all options with the specified value, but this code only gets the text from the first option found. Having more than one option with the same value is pretty useless, so that feature of the original code is most likely unintended.


This Will Work.

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

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜