[SOLVED] event.target issue regarding label and custom attributes

Question

I want to grab the value of the label of a select option, and the attribute for label is set as attribute for the <option> node.
The problem is this:

event.target.name = ok
event.target.value = ok
event.target.label = undefined // not ok

The solution i have come up with, is by using this:

event.target.selectedOptions[0].label

Is there any alternative to the above solution?

Why doesn't event.target recognize the label attribute? Is it because the target happens on the <select> instead of the <option>? If so, then why event.target.value works but event.target.label doesn't?

I noticed this occurs with any type of custom attributes also.

The code can be found here. Please check the console after switching through <select> options:

https://code.sololearn.com/WHclKvDQ4yQm/#html

Answer 1

The event target is the <select> not the <option> so it returns 'undefined' since the <select> does not have a label.

Secondly, a select elements value is the value of the selected option so event.target.value will work.

Answer 2

Ore
I understood! thanks for the answer!