I'm having trouble understanding what you are asking exactly. Let me see if I understand:

you would like the user to click the a link, then execute a script (on click), but you would like to prevent the page from going to the clicked url. Furthermore, you would like to use the url of the href as data or parameter in the function. If this is what you want then yes it is possible and straight forward.

<a href="https://example.com/some-url?p=someparam" id="myLink">Click to Execute</a>
<script>
const link = document.querySelector("#myLink");
link.addEventListener('click', function (event) {
 event.preventDefault(); // this prevents the link from navigating to the next page
 const myHref = event.target.getAttribute("href")
 console.log('myHref is',myHref)
 // do something with the href
})
</script>

Here is a demo:
[jsfiddle.net...]

Now I recommend not to do that, you can, it works and there is nothing terribly wrong with it. But there is a better way. A link is intended to be used to take the user to another page, while it common practice to use the link as above it is not ideal. Instead you can use a button, and instead of using the "href" attribute make your own using "data-" for example "data-url". Here is that version:

<button data-url="https://example.com/some-url?p=someparam" id="myButton">Click to Execute</a>
</script>
const button = document.querySelector("#myButton");
button.addEventListener('click', function (event) {
// you no longer need to prevent anything event.preventDefault(); // this prevents the link from navigating to the next page
 const myHref = event.target.getAttribute("data-url")
 console.log('myHref is',myHref)
 // do something with the href
})
</script>

Here is a demo again with both versions:
[jsfiddle.net...]

Note you can always style your button with CSS to like a link.

I hope this help.

Thanks I’ll check and revert back!

Btw the code of the second example seems wrong? Can you check please?

The code in the second demo works fine. Copy the code from there. It could be that you missed a bracket or something as this forum's code highlighting is a bit glitchy. If you use the code from the demo and still have a problem, post the error and I'll help you find a fix.

Hi so you have the following code:

<button data-url="https://example.com/some-url?p=someparam" id="myButton">Click to Execute</a>

This looks like some missing a href and button tags?

It's a button, it doesn't have an href. That is exactly the point here. A link (<a> tag) and it's href are intended to take the user to a new page. A button is simply used to receive a user action, in this case providing a "url" to a script. Now maybe I misunderstood. When the user clicks the link, will the user navigate to the that page, and you want to feed the url to a script before the user leaves?

No I don't want to navigate to the url, just run a JS file that'll use the URL clicked.

So your next example is missing </button> instead of </a> no?

Yes that is my bad. <button></button> sorry!

Ok thanks! I'm checking on codepen but their console doesn't show the result in the console section.

Ok your code is working. Thanks so much, appreciate it! :)

BTW in the second code example do you need this code?

event.preventDefault();

No I don't want to navigate to the url, just run a JS file that'll use the URL clicked.

Is there a reason you can't simply put

<script type = "text/javascript" src = "filename.js"></script>

in the HEAD of the document?

(Got a vague idea you no longer need to specify a “type”, but I tend to get this wrong and it would be a non-fatal error anyway.)

BTW in the second code example do you need this code?
event.preventDefault();

No. event.prevetnDefault() prevents the browser from executing the default action of the event. So in the case of an <a> tag, it prevents the browser from navigating to the link, if it is a click on a form submit button it prevents the form from being submitted. In the case of a <button>, there is no default behavior so it is not needed.

For a more complete explanation see this:
[developer.mozilla.org...]

@Lucy24

Got a vague idea you no longer need to specify a “type”,

That is correct, type attribute is no longer needed in the script tag.