Невозможно прочитать свойство 'style' of undefined - Uncaught Type Error

Я хотел бы изменить цвет, шрифт и размер шрифта текста в элементе span на странице html.Невозможно прочитать свойство 'style' of undefined - Uncaught Type Error

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

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, Пожалуйста, дайте мне знать, где происходит не так.

источник

2017-02-21 sravan kumar

Это работает, когда я пробую его здесь: https://jsfiddle.net/du2ot93e/ - Я думаю, что ваш оператор 'if' терпит неудачу. –

Вы достигаете инструкции 'if'? – piotrbienias

Этот код работает. Вещи, которые вы должны искать: есть ли условие, которое вы хотите? Вы читаете стиль «стиль» в другом месте вашего кода? Там, где код не работает? – Bruno

Добавить свой <script> в нижней части вашего <body>, или добавить прослушиватель событий для DOMContentLoaded после this StackOverflow question.

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

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

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

источник

2017-02-21 14:35:58

В настоящее время она работает, я только изменил оператор > для того, чтобы работать в сниппет, посмотрите:

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>

источник

2017-02-21 13:38:49

Невозможно прочитать свойство 'style' of undefined - Uncaught Type Error

ответ

Смежные вопросы