Блог

у меня есть предварительный просмотр ссылок, которые работают с API linkpreview

вот Jsfiddle с демонстрацией: https://jsfiddle.net/e4wdcjgz/

мне нужна помощь, чтобы внести эти коррективы:

• javascript должен перехватывать все ссылки внутри div и добавлять после этого результат

Вот демонстрация моей реальной ситуации:

https://jsfiddle.net/3xznoLhj/

вот фактический код:

 var data = { key: "my-api-key", q: "https://tomshw.it" };

fetch("https://api.linkpreview.net", {
  method: "POST",
  mode: "cors",
  body: JSON.stringify(data)
})
  .then((res) => res.json())
  .then((response) => {
    document.getElementById("mytitle").innerHTML = response.title;
    document.getElementById("mydescription").innerHTML = response.description;
    document.getElementById("myimage").src = response.image;
    document.getElementById("myurl").innerHTML = response.url;
  });

 

p.s. элемент в данный момент не создается, потому что я не знаю, как добавить результат к каждой ссылке

• Что я понимаю о вас, так это то, что вы хотите добавить html после элемента ссылки, и вы можете сделать это с element.insertAdjacentHTML(position, html) помощью метода этот метод имеет 4 значения для выбора позиции элементов "afterbegin" , "afterend" , "beforebegin" , "beforeend"

Вот пример

 var htm = `<h2>Request is finished</h2>
<div> Response is `  123   `</div>`;
document.body.insertAdjacentHTML("afterend", htm);