I have the following code, which I use to embed an iframe and I need to remove a part of the resulting embedded iframe src URL.

Here is the javascript code which generates the HTML

<script src="https://booking-widget.phorestcdn.com/obwidget.bundle.js"></script> 
<script>
  window.widget = new OBWidget('colindemonew11')
</script>

This generates an iframe with the following code:

<iframe src="https://phorest.com/book/salons//colindemonew11?utm_source=booking_widget" frameborder="0" scrolling="yes" style="width: 100%; height: 100%;"></iframe>

I'm hoping to be able to change the javascript before it executes, so instead of accessing

https://phorest.com/book/salons//colindemonew11?utm_source=booking_widget

Instead this url is used:

https://phorest.com/book/salons//colindemonew11?utm_source=[MY_PARAMS_GO_HERE]

Basically, I would like to replace the params in the URL being used, or communicate these params to the iframe in some way.

One thing I'm having trouble with is that the there is no ID or class name for the iframe, so I guess I'm going to have to select the firs iframe? e.g. iframe[0] or another way could be to check for the DIV to make sure the iframe is inside it. I guess I could use this:

document.getElementsByTagName('iframe')[0]

However, I'm not sure how to limit it to be inside the div which is produced:

<div class="ob-widget-container-frame-container"><iframe src="https://phorest.com/book/salons//colindemonew11?utm_source=booking_widget" frameborder="0" scrolling="yes" style="width: 100%; height: 100%;"></iframe></div>

I'm wondering if it is possible to do this by changing the javascript before it is loaded? Would be grateful if this is possible to find out how it could be achieved.

Another way is to send the params using postMessage. However, this seems a little complicated and hard to find a way of doing it for this use case.

Any suggestions are much appreciated.