如何设置 select 选项等于 innerHTML

Question

I'm currently using flask to program this code. My problem is I need to make the option value equal to the inner text of the option.

{% for symb in symbol %}
<script src="/static/script.js"></script>
<option id="options" value="0">{{ symb["symbol"] }}</option>
{% endfor %}

This is the code for the /static/script.js

let option = document.querySelector('option').text;
changeContent(option);
function changeContent(option)
{
     var opt = document.querySelector('option').options[0];
     opt.value = option;
}

If I run the code, the option presents the actual text of {{ symb["symbol"] }}. However, it does copy it to the option value.

Answer 1

Added this as an answer to update on the comment seen as it solved the issue and may help others

You're approaching this the wrong way. Rather than using JavaScript to do this render your template with the correct values to begin with

Also as it stands, you're including your script tag within your for loop. This probably isn't what you want, so move it outside the for.

eg

<script src="/static/script.js"></script> 
{% for symb in symbol %} 

<option id="options" value="{{symb["symbol"]}}">{{ symb["symbol"] }}</option> 
{% endfor %} 

Apologies for the formatting I'm on mobile