Как сделать переменную JAVASCRIPT равной атрибуту HTML?

Question

В основном я пытаюсь отобразить номер, начинающийся с 0, и случайный ход при каждом нажатии кнопки. Но мне нужна переменная, чтобы она соответствовала текущему номеру (который хранится в теге h1). Как мне это сделать? В настоящее время, когда я пытаюсь проверить, если он работает, предупреждая страницу, все это я получаю [объект HtmlHeadingElement] Вот мой JavaScript, CSS и HTML код, соответственно:

function myRandom() { 
 
    var headnumber = document.getElementById('headnum'); 
 
    alert(headnumber) 
 
    //the alert is just to check if '0' comes up' 
 
}

 

 
h1 { 
 
    text-align: center; 
 
    font-size: 30px; 
 
    color: blue; 
 
    font-family: Verdana; 
 
} 
 
button { 
 
    margin-left: 640px; 
 
    border: solid blue 5px; 
 
    font-size: 14px; 
 
    font-family: Verdana; 
 
    font-weight: bold; 
 
    background-color: cyan; 
 
    border-radius: 6px; 
 
}

<h1 id='headnum'>3</h1> 
 
<button onclick="myRandom()">Button</button>

Answer 1

You может получить содержимое html, используя innerHTML. Смотри ниже,

function myRandom() { 
 
    var headnumber = document.getElementById('headnum').innerHTML; 
 
    alert(headnumber) 
 
    //the alert is just to check if '0' comes up' 
 
}

h1 { 
 
    text-align: center; 
 
    font-size: 30px; 
 
    color: blue; 
 
    font-family: Verdana; 
 
} 
 
button { 
 
    margin-left: 640px; 
 
    border: solid blue 5px; 
 
    font-size: 14px; 
 
    font-family: Verdana; 
 
    font-weight: bold; 
 
    background-color: cyan; 
 
    border-radius: 6px; 
 
}

<h1 id='headnum'>3</h1> 
 
<button onclick="myRandom()">Button</button>

Answer 2

Назначение headnumber является объектом вызова, возвращенного в document.getElementById('headnum') функции. Чтобы получить значение внутри объекта, используйте document.getElementById('headnum').innerHTML