¿Es normal este comportamiento al crear un enlace con document.createElement("a") ?
function updateUl(newVal){ let a = document.createElement("a") let newListItem = document.createElement("li") a.appendChild(document.createTextNode(newVal)) console.log(newVal) //output: "www.google.com" a.href = newVal console.log(a.href) //output: "http://127.0.0.1:5500/www.google.com" a.target = "_blank" newListItem.appendChild(a) ulEl.appendChild(newListItem) }Luego, claramente, cuando hago clic en el enlace, aparece un error de página no encontrada .
¿Que esta pasando?
Sin un protocolo, se supone que es una ruta en la página actual. Agregue el protocolo https:// para que navegue.
function updateUl(newVal){ // pass in as "https://www.google.com" let a = document.createElement("a") let newListItem = document.createElement("li") a.appendChild(document.createTextNode(newVal)) console.log(newVal) //output: "https://www.google.com" a.href = newVal console.log(a.href) //output: "https://www.google.com" a.target = "_blank" newListItem.appendChild(a) ulEl.appendChild(newListItem) }o agregarlo dinámicamente
function updateUl(newVal){ if (!newVal.startsWith("http://") && !newVal.startsWith("https://") { newVal = `https://{newVal}`; } let a = document.createElement("a") let newListItem = document.createElement("li") a.appendChild(document.createTextNode(newVal)) console.log(newVal) //output: "https://www.google.com" a.href = newVal console.log(a.href) //output: "https://www.google.com" a.target = "_blank" newListItem.appendChild(a) ulEl.appendChild(newListItem) }