Accessibility for a select tag that dynamically changes the URL of the following anchor tag

I have a simple anchor element and a script (not shown) that will dynamically change the URL of the anchor element when the select tag is changed (to the url in the data-url attribute):

<select>
    <option value="" disabled selected>Select a site</option>
    <option value="Google" data-url="https://google.com">Google</option>
    <option value="Stackoverflow" data-url="https://stackoverflow.com">Stackoverflow</option>
    <option value="Example" data-url="https://example.com">Example</option>
</select>

<a href="#">Go to site</a>

I'm curious if this would make sense from an accessibility standpoint or if there's some aria attributes that I should use on the anchor/select tag that would help a user understand the purpose of the select tag here.

Would it make more sense to wrap everything in a form tag and change the action attribute dynamically and have the anchor change into a submit button/input?

<form action="<dynamically change this>" method="get">
    <select>
        <option value="" disabled selected>Select a site</option>
        <option value="Google" data-url="https://google.com">Google</option>
        ...
    </select>
    <button type="submit">Go to site</button>
</form>
Tags: , , , , , ,