獲取[object HTMLLIElement]而不是文本。 Javascript函數

你好，我有一個簡單的javascript函數，它可以通過按下按鈕來選擇無序列表中的一個隨機列表項。它工作正常，當單擊按鈕時，控制檯吐出一個隨機列表項，但當我嘗試在HTML頁面上顯示它時，我所得到的就是這個奇怪的[對象HTMLLIElement]而不是文本。獲取[object HTMLLIElement]而不是文本。 Javascript函數

目標是顯示列表項目之間的文本。當我點擊按鈕時，它會選擇一個隨機列表項目，例如：<li>5</li>，但我只想顯示5。

下面是HTML：

<ul id="list"> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
    <li>4</li> 
    <li>5</li> 
    <li>6</li> 
    <li>7</li> 
</ul> 

<button id="randomize">randomize</button> 

<p id="result">hello</p>

和JS：

var randomize = document.getElementById("randomize"); 
var listItems = document.getElementById("list").getElementsByTagName("li"); 
var result = document.getElementById("result"); 

randomize.addEventListener("click", randomizeIt); 

function randomizeIt() { 
    var randomItem = listItems[Math.floor(Math.random() * listItems.length)]; 
    result.innerHTML = randomItem; 
    console.log(randomItem); 
}

在此先感謝

來源

2017-07-06 cup_of

那麼你設置導致的li對象，你必須得到裏面的文本

result.innerHTML = randomItem.textContent;

來源

2017-07-06 16:00:43 Musa

作品完美謝謝 –

Hadeaz只是建議做randomItem.innerHTML這個工作爲好，你能解釋的區別，哪一個是更好地使用？ –

在這種情況下，它會執行相同的操作，因爲它不包含任何html元素。如果它是'

'innerHTML會給你'''而'textContent'仍然會給你'7'。 – Musa

如果您只需要訪問<li>的innerHTML所需的值。

result.innerHTML = randomItem.innerHTML;

來源

2017-07-06 16:05:05 Hadeaz

謝謝你這個作品 –

獲取[object HTMLLIElement]而不是文本。 Javascript函數

回答

相關問題