Добавить полную ширину фона в TextNode, который будет охватывать любой другой контент на странице

Question

Я использую текстовый узел для отображения загрузки текста на странице, если ссылка содержит запрос. Мне нужна помощь с добавлением текстового узла с белым фоном полной ширины и высоты, чтобы покрыть весь другой текст на странице и отображать сообщение, если ссылка содержит конкретный запрос.

Пожалуйста, см. Мой код ниже. Спасибо за помощь

Javascript:

if (location.search === '?verify=speew') { 
    var paragraph = document.getElementById("addsigmamsg");
    var text = document.createTextNode("Please wait");

    paragraph.appendChild(text);

}

HTML:

<h1 id="addsigmamsg"></h1>

Answer 1

Вы можете установить стили, упомянутые выше, и расположить их по краям порта дисплея (при условии, что нет других родителей со свойством позиции), используя код ниже

if (location.search === '?verify=speew') { 
    var paragraph = document.getElementById("addsigmamsg");
    var text = document.createTextNode("Please wait");
    paragraph.appendChild(text);
    paragraph.style.position = 'absolute';
    paragraph.style.left = '0px';
    paragraph.style.top = '0px';
    paragraph.style.background = 'white';
    paragraph.style.width = '100vw'; 
    paragraph.style.height = '100vh'; 
}

HTML:

<h1 id="addsigmamsg"></h1>