Возвращает [object HTMLDivElement].?

Question

[Alexander3928]

Как можно записать чтобы в overlay можно было добавить элементы из функции createContentModal с помощью innetHTML. Чтобы не было ошибки [object HTMLDivElement]?

export function modal() {
  const modalId = document.querySelectorAll("#modal");
 
  modalId.forEach((element, index) => {
    element.addEventListener("click", event => {
      if (event.target.hasAttribute("id", "modal")) return;
      document.body.appendChild(createModal(event));
    });
  });
 
  const createModal = (event) => {
    const modal = document.createElement("div");
    const overlay = document.createElement("div");
 
    modal.classList.add("modal");
    overlay.classList.add("modal__overlay");
 
    const createContentModal = () => {
      const content = document.createElement("div"),
            image = document.createElement("img"),
            link = document.createElement("a");
 
      content.classList.add("modal-content");
      image.classList.add("modal-content__image");
      link.classList.add("modal-content__link");
      
      image.src = event.path[0].currentSrc;
      link.href = "https://wakatime.com/dashboard";
      link.textContent = "This Week";
 
      content.append(image, link);
 
      return content;
    };   
    
    overlay.innerHTML = createContentModal();
    modal.append(overlay);
 
    return modal;
  };
}

Comments

[0xD34F]

Как можно записать чтобы в overlay можно было добавить элементы из функции createContentModal с помощью innetHTML.

Никак. Могли бы и сами до этого догадаться. Конечно, если бы знали, что такое элемент, и что такое innerHTML.

Answer 1

[alexalexes]

let div = document.createElement('div'); // создаем div лишь для того, чтобы положить в него результат функции createContentModal
div.appendChild(createContentModal()); 
overlay.innerHTML = div.innerHTML; // и передать его html содержимое куда надо