it-swarm.com.ru

Не удается прочитать свойство 'style' из undefined - ошибка типа Uncaught

Я хотел бы изменить цвет, размер шрифта и вес шрифта текста в элементе span HTML-страницы.

Я использую следующий код:

if(window.location.href.indexOf("test") > -1){
    var search_span = document.getElementsByClassName("securitySearchQuery");
    search_span[0].style.color = "blue";
    search_span[0].style.fontWeight = "bold";
    search_span[0].style.fontSize = "40px";
}

Ниже приведен код для моей HTML-страницы

<h1 class="keyword-title">Search results for<span class="securitySearchQuery"> "hi".</span></h1>

Я думал о получении элементов по идентификатору, но, к сожалению, они только классы и не идентификаторы. У меня нет доступа, чтобы изменить HTML-код, но просто добавить JS-код на сайт извне.

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

This is the screenshot of the error which I am getting in Chrome browser

8
sravan kumar

Добавьте свой <script> В конец <body> Или добавьте прослушиватель событий для DOMContentLoaded follow этот вопрос StackOverflow .

Если этот сценарий выполняется в разделе кода <head>, document.getElementsByClassName(...) вернет пустой массив, поскольку DOM еще не загружен.

Вы получаете Type Error, Потому что ссылаетесь на search_span[0], Но search_span[0] Равно undefined.

Это работает, когда вы выполняете его в Dev Tools, потому что DOM уже загружен.

12
J. Titus

Сейчас он работает, я только что сменил оператора > чтобы работать во фрагменте, посмотрите:

window.onload = function() {

  if (window.location.href.indexOf("test") <= -1) {
    var search_span = document.getElementsByClassName("securitySearchQuery");
    search_span[0].style.color = "blue";
    search_span[0].style.fontWeight = "bold";
    search_span[0].style.fontSize = "40px";

  }

}
<h1 class="keyword-title">Search results for<span class="securitySearchQuery"> "hi".</span></h1>
2
Jordi Flores