Изменение встроенного CSS без идентификатора или класса с помощью JS

Question

ну я пытаюсь удалить добавление с этого сайта anisp.gq , поставленное хостинг-провайдером ... это тренировочный сайт просто для удовольствия ...

Сервер, на котором размещен сайт, помещает это дополнение после всего кода, и у меня нет доступа к этому последнему биту кода на стороне панели администратора :

<!-- Actual Website Code Above^^^ --> 
<!-- Last bit of add code that I want to remove ↓↓ -->

<div style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;">

    <a target="_blank" href="https://www.freewebhostingarea.com" title="Free Web Hosting with PHP5 or PHP7">

    <img alt="Free Web Hosting" src="https://www.freewebhostingarea.com/images/poweredby.png" style="border-width: 0px;" width="180" height="45">

    </a>
    </div>

Следовательно, у меня нет доступа к этому последнему фрагменту кода, я решил использовать JavaScript, чтобы изменить тег встроенного дисплея, но из-за отсутствия идентификатора или класса, я борюсь ...

Я пытался заставить теги стиля отображать атрибут атрибута на none в этом разделе div ...

Но, как вы видите, там нет идентификатора и тега класса, поэтому

document.getElementById("myDIV").style.display = "none"; 

на мой взгляд, не подлежит обсуждению ...

Я пытался сказать глупость, как это:

var node = document.querySelector('[style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;"]').display="none";

/ * и ниже * * *

 var node = document.querySelector('[style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;"]');

document.getElementById("node").style.display ="none";

и некоторые другие вещи, но ничего не работает, и мое отсутствие знаний с DOM и JS тоже не помогает ... поэтому я понятия не имею, что я делаю, правильно, неправильно или что ... Пожалуйста, скажите мне, что правильно подход ...

Спасибо за ваше время

Answer 1

Вы можете выбрать целевой тег <a>, а затем перейти к родительскому тегу.

var node = document.querySelector(
  'a[href="https://www.freewebhostingarea.com"]'
).parentNode;

node.style.display = 'none';

Answer 2

Если вам нужно решение без поддержки JavaScript, этот CSS подойдет.

div[style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;"] {
  display: none !important;
}

Answer 3

Обе ваши попытки почти срабатывают, в обеих есть только небольшая проблема.
Для первой вы пропускаете style перед отображением.

var node = document.querySelector('[style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;"]').style.display = "none";

<div style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;">

  <a target="_blank" href="https://www.freewebhostingarea.com" title="Free Web Hosting with PHP5 or PHP7">

    <img alt="Free Web Hosting" src="https://www.freewebhostingarea.com/images/poweredby.png" style="border-width: 0px;" width="180" height="45">

  </a>
</div>

В последней попытке вы не используете значение, которое вы присваиваете своей переменной node.Должно быть так:

 var node = document.querySelector('[style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;"]');

node.style.display = "none";

<div style="text-align:right;position:fixed;bottom:3px;right:3px;width:100%;z-index:999999;cursor:pointer;line-height:0;display:block;">

  <a target="_blank" href="https://www.freewebhostingarea.com" title="Free Web Hosting with PHP5 or PHP7">

    <img alt="Free Web Hosting" src="https://www.freewebhostingarea.com/images/poweredby.png" style="border-width: 0px;" width="180" height="45">

  </a>
</div>