Return to Revisions

I hope this helps. Made some comments in the snippet.

/* Create <option> tags */
class OptionTime extends HTMLSelectElement {
 constructor() {
 super();
 this.setDateRange();
 }
 setDateRange() {
 const now = new Date();
 const year = now.getFullYear();
 const unit = this.dataset.range.split(' ')[2]; 
 const startYear = year - 50; // No need to deconstruct start/end and assign years again.
 const endYear = year - 18;
 
 // `this` give access to HTML element directly.
 this.setAttribute('data-range', `${startYear} ${endYear} ${unit}`);
 for (let i = startYear; i <= endYear; i++) {
 this.add(new Option(`${i}${unit}`, `${i}${unit}`));
 }
 }
};
customElements.define('option-time', OptionTime, {
 extends: 'select'
});

<select is="option-time" name="Year" data-range="%startYear% %endYear% 年">
 <option value="" disabled selected>Year</option>
</select>
<select is="option-time" name="Month" data-range="1 12 月">
 <option value="" disabled selected>Month</option>
</select>
<select is="option-time" name="Day" data-range="1 31 日">
 <option value="" disabled selected>Day</option>
</select>