Why can't I capture the <option> tag with the view selector?

According to the DOC ,

Elements are considered visible if they consume space in the document. Visible items have a width or height that is greater than zero.

I checked the option tag, it seems that there is no css property with it to ignore its space from the DOM. Although, while I select the option tag using the :visible selector, it does not select anything. It seems mysterious to me.

HTML:

 <select> <option selected=true>test</option> <option>test1</option> <option>test2</option> <option>test3</option> <option>test4</option> </select> 

JS:

 console.log($('select option:visible').length); // Length always returns 0 

Demo

Can someone explain reliably what is happening behind this?

+4
javascript jquery html css
source share

No one has answered this question yet.

See similar questions:

4
jQuery "visible" does not work in all browsers, but in Firefox

or similar:

1270
Why do not self-closing script elements work?
1184
jQuery get specific option tag text
540
Why do browsers match CSS selectors from right to left?
140
When should the <script> tags be visible and why can they?
6
What is the best way to test an element in the DOM
1
Elements with a height of 0 are still considered visible. Are there any alternative solutions?
0
REGEX to find option tag in javascript
0
Confused about the css pseudo selector
0
Find hidden options using jquery
0
JQuery treats objects with zero width and height as invisible

All Articles