Uncaught TypeError: Не удается прочитать свойство 'id' из null

Question

Я пытаюсь создать аудиоплеер html5. Это для радиостанции, поэтому мне нужен плеер, чтобы перезагрузить источник и начать играть с 'currrentTime = 0;' когда поток начнется снова. Я получаю ошибку в скрипте, хотя, и я не уверен, почему?

Мой скрипт запускается

Ошибка Расположение: if (player.id == 'paused') { - я получаю ошибку: ' Uncaught TypeError: Cannot read property 'id' of null

HTML:

<audio onplay="checkState()" controls="controls" id="paused" src="http://rmceng.radiomaria.ca:8162/;stream.mp3"></audio> 

Мои JS:

function checkState() { 
var player = document.getElementById('player'); 
var psrc = 'http://rmceng.radiomaria.ca:8162/;stream.mp3'; 
if (player.id == 'paused') { 
    player.currentTime = 0; 
    player.src = psrc; 
    player.load(); 
    player.play(); 
    document.getElementById('player').id = 'playing'; 
} 
else { 
    player.pause(); 
    player.src = ""; 
    document.getElementById('player').id = 'paused'; 
    } 
} 

window.onload = function(){ 
    checkState(); 
} 

Answer 1

У Вас нет ни одного элемента в вашей разметке с идентификатором. Поэтому, когда вы сообщаете JS getElementById, он ничего не может найти. Таким образом, значение становится «null». После этого вы вызываете player.id - это то же самое, что пытаться вызвать идентификатор свойства объекта, который не существует.

Чтобы исправить: Дайте игроку атрибут id="player" или измените вызов выбора. Существуют и другие способы выбора элементов.

document.getElementById(id_string) 
document.getElementsByTagName(tag_name) 
document.getElementsByClassName("class_values") 
document.getElementsByName("name_value") 
document.querySelector(css_selector) 
document.querySelectorAll(css_selector)