Updated HTML and Javascript in HTML

I'm using the most recent Version of Safar (9.0)


I'm using Xcode to edit some local JavaScript and HTML that is being viewed in Safari (Please let me know if there is a better way of doing what I'm describing, I'm all ears).

My problem is that when I make the changes to the Javascript in Xcode then save, even when reloading the HTML and associated Javascript files (both using the reload button in the address bar and the Reload [Ignoring Cache and Generic Options] on the Resources Panel, the changes to the underlying files do not become visible (even after the refreshes)


Even when I'm not running with breaks I have to do one of two things to get the changes to become visible

a) close out the page completley by closing the tab

b) under resources clicking the source file in question so the javascript pops up in a new tab, then clicking the refresh button on the Resources panel.


Is there an easier way to get the changes to become visible in Safari as soon as I save them in xCode?


Is there a better way to do this that involves either Only Safari or Only xCode thanks, Jeff

I recommend you try with this code to get both the link and text copied to clipboard and let me know the results

const onClick = evt => { let text = "Text to be converted to a link."; let url = "hola puede ir a https://google.com" + "\n\n" + "https://www.apple.com"; let element = document.getElementById("my-element");

element.innerHTML = `<a href="${url}">${text}</a>`; 
let varName = document.getElementById("links").value;

content.innerHTML = varName;
element.innerHTML = varName + url;
navigator.clipboard.writeText(element.innerHTML);
 
}
document.querySelector('#links').addEventListener('click', onClick);

Please try this and let me know

DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="keywords" content=""> <meta name="description" content=""> </head> <body> <button id="link">!<a href="#">....</a>
</button> <textarea type="text" id="Pass" class="botonMapa" value=""></textarea> <div id="Template">
<div id="tarjetas" style="overflow-y: scroll; overflow-x:hidden; height:500px; float: center;">
<table id="tabla" class="tabla"> <tr class="buscador"> </tr> <tr class="head"> <th class="head" style="background-color: #2f3030; color: white; height: 30px; "> <input style="color: white; width: 400px;" type="text" id="tfBuscar" class="Buscador" placeholder="Buscar..." /> </th> </tr> <tr> <td class="tarjeta"><button class="art bdoton">HT202020</button><button class="boton"><a id="melement" value="hola" href="#" target="_blank">Google link</a>IOS 17 - Verificar Cx - Articulo <a id="melement" value="hola" href="#" target="_blank">YT</a></button> </td> </tr> <tr> <td class="tarjeta"><button value="apple..." id="apel" class="boton">Manzana<a id="myelement" href="#" target="_blank">A ple</a></button> </td> </tr> <tr class="resultados"> <th><span class="resultados"></span></th> </tr> </table> </div> </div> <script> const botones = document.querySelectorAll(".boton"); const cuandoSeHaceClick = function (evento) { let urrl = this.querySelector('a').href; const texto = this.querySelector('a').innerHTML; document.getElementById("link").innerHTML = <a href="${urrl}">${texto}</a>;

//const link = this.querySelector('a'); -only selector a-
const link = this;
const range = document.createRange();
range.selectNode(link);
const selection = window.getSelection();	
selection.removeAllRanges();
selection.addRange(range);
const successful = document.execCommand('copy');	
Pass.value = this.value;		
navigator.clipboard.write([clipboardItem]);
this.style.borderColor = "blue";		
} 
botones.forEach(boton => {
boton.addEventListener("click", cuandoSeHaceClick);
});  	
</script>     

</body> </html>

Updated HTML and Javascript in HTML
 
 
Q