#javascript #html
#javascript #HTML
Вопрос:
Итак, я попробовал три разных способа заставить элемент полностью исчезнуть с экрана (показано в приведенном ниже коде). Всякий раз, когда я обновляю страницу, для каждого решения, которое я пробовал, возникает какой-то сбой. Под сбоем я подразумеваю, что когда я обновляю сайт, он показывает исходный текст и быстро удаляет его. Мне интересно, есть ли способ предотвратить это, сделав это альтернативным способом.
РЕДАКТИРОВАТЬ: я пытаюсь создать свой собственный фреймворк JS, поэтому встроенный — это не тот маршрут, по которому я хочу идти.
// WAY 1
let elementWay1 = document.getElementById('demo1');
elementWay1.remove();
// WAY 2
let elementWay2 = document.getElementById('demo2');
elementWay2.style.display = 'none';
// WAY 3
let elementWay3 = document.getElementById('demo3');
elementWay3.style.visibility = 'hidden'; <!DOCTYPE html>
<html>
<body>
<p id="demo1">HelloSo, I attempted three different ways to make an element disappear completely from the screen (displayed in the code below). Whenever I refresh the page, for each solution I tried, it has a glitch of some sort. By glitch, I mean, when I refresh the site, it shows the original text and quickly takes the text off. I'm wondering if there is a way of preventing this from happening by doing it in an alternative way.So, I attempted three different ways to make an element disappear completely from the screen (displayed in the code below). Whenever I refresh the page, for each solution I tried, it has a glitch of some sort. By glitch, I mean, when I refresh the site, it shows the original text and quickly takes the text off. I'm wondering if there is a way of preventing this from happening by doing it in an alternative way.</p>
<p id="demo2">HelloSo, I attempted three different ways to make an element disappear completely from the screen (displayed in the code below). Whenever I refresh the page, for each solution I tried, it has a glitch of some sort. By glitch, I mean, when I refresh the site, it shows the original text and quickly takes the text off. I'm wondering if there is a way of preventing this from happening by doing it in an alternative way.So, I attempted three different ways to make an element disappear completely from the screen (displayed in the code below). Whenever I refresh the page, for each solution I tried, it has a glitch of some sort. By glitch, I mean, when I refresh the site, it shows the original text and quickly takes the text off. I'm wondering if there is a way of preventing this from happening by doing it in an alternative way.</p>
<p id="demo3">HelloSo, I attempted three different ways to make an element disappear completely from the screen (displayed in the code below). Whenever I refresh the page, for each solution I tried, it has a glitch of some sort. By glitch, I mean, when I refresh the site, it shows the original text and quickly takes the text off. I'm wondering if there is a way of preventing this from happening by doing it in an alternative way.So, I attempted three different ways to make an element disappear completely from the screen (displayed in the code below). Whenever I refresh the page, for each solution I tried, it has a glitch of some sort. By glitch, I mean, when I refresh the site, it shows the original text and quickly takes the text off. I'm wondering if there is a way of preventing this from happening by doing it in an alternative way.</p>
</body>
</html> Я знаю, что код приводит к ошибке, потому что я включил в код все три способа.
Ответ №1:
Похоже, что страница достаточно велика, чтобы между отображением элемента и запуском скрипта была хотя бы небольшая задержка. Вы могли бы смягчить это, уменьшив размер страницы и / или поместив скрипт встроенным вместо ссылки на внешний via script src . Чтобы убедиться, что он запускается как можно скорее, я бы поместил скрипт сразу после элемента, который вы хотите удалить, например:
<p id="demo">Hello</p>
<script>
document.getElementById('demo').remove();
</script>
или, по крайней мере, должны <script> быть не слишком далеко отделены от #demo элемента. Не ждите загрузки всего документа (не ждите DOMContentLoaded ) перед запуском скрипта.
Комментарии:
1. Я пытаюсь создать свой собственный небольшой фреймворк, поэтому встроенный в данном случае не сработает. Наверное, мне следовало бы указать это в вопросе. @CertainPerformance
2. Не могли бы вы пояснить, почему поиск способа более быстрого запуска скрипта не сработал бы? Независимо от того, пытаетесь ли вы создать фреймворк или нет, это не должно влиять на эффективность решения
3. Ну, я имею в виду, я чувствую, что важно, чтобы код выполнялся более эффективно, в общем, ради пользователя. Однако, при всем моем уважении, я не совсем понимаю, как объяснить то, о чем я спрашиваю, вот почему я спрашиваю. Мне просто нужно знать, есть ли другой и более эффективный способ сделать это так, чтобы он не зависал. Я не знаю, как уменьшить размер экрана, я не могу сделать это на экранах других людей, чтобы он работал и на их экранах. 🙂
4. я обновил ваш фрагмент. Я не думаю, что вы можете избежать задержки. Страница должна сначала загрузиться, прежде чем вы сможете удалить, удалить или скрыть элемент. если элемент содержит много, вы застряли
5. @user15155940 Я не понимаю, какое отношение к этому имеет эффективность — я не вижу в вопросе или ответе ничего, что могло бы оказать заметное влияние на эффективность. (за исключением того факта, что у вас, похоже, много содержимого HTML, которое вызывает задержку)