Блог

Главная - Вопросы по программированию - Javascript удаляет стиль, не указывая ему идентификатор или класс

Javascript удаляет стиль, не указывая ему идентификатор или класс

#javascript

#javascript

Вопрос:

итак, у меня есть этот HTML-код, в котором я скрываю тело веб-сайта, используя

     <style>
        body{
          display: none;
        }
    </style>

    <body>
    <p>Something..</p>
    </body>

но теперь я хочу удалить это с помощью Javascript, не указывая телу идентификатор или класс. В качестве решения я попробовал следующее, но оно не работает.

 document.getElementsByTagName("body")[0].removeAttribute("style");

Любая помощь приветствуется. Спасибо.

Комментарии:

1. Быстрый вопрос: почему вы хотите скрыть веб-сайт в первую очередь?

2. Привет, это для простого веб-приложения, которое я пытаюсь создать. Я просто упростил вопрос, чтобы было легче понять мою проблему.

3. ОК. Почему вы не хотите использовать классы?

4. вы можете напрямую задать свойства document.body.style . document.body.style.display = 'block'

Ответ №1:

Вы можете установить document.body для display свойства style значение unset :

 document.body.style.display = "unset" 
 <style>
  body {
    display: none;
  }
</style>

<body>
  <p>Something..</p>
</body>

Ответ №2:

Если вы хотите удалить теги стиля, добавленные в ваш HTML, вы должны выбрать его с помощью document.getElementsByTagName и вызвать remove метод для его узлов.

Рабочая скрипка

 document.getElementsByTagName("style")[0].remove(); 
 body {
  display: none;
} 
 <p>Something..</p>

Если вы хотите задать стиль для элемента

Если вы просто хотите установить display стиль тега body, вы можете сделать это с помощью javascript.

 document.getElementsByTagName("body")[0].style.display

Более общее решение

 const body = document.getElementsByTagName("body")[0];
const targetStyles = {
  display: 'block',
}
Object.entries(targetStyles).forEach(([style, value]) => body.style[style] = value); 
 body {
  display: none;
} 
 <p>Something..</p>

В чем проблема с вашим скриптом?

 document.getElementsByTagName("body")[0].removeAttribute("style");

Этот скрипт выбирает body тег из HTML и удаляет встроенный стиль, добавленный в тело. Он будет работать для приведенного ниже шаблона, но не для вашего требования.

 document.getElementsByTagName("body")[0].removeAttribute("style"); 
 <body style="background: blue;">
  <p>Something..</p>
</body>

Метки: