獲取元素的最後一次出現

getElementById(id)返回具有匹配ID屬性的元素。我怎麼能得到這個元素的最後一次出現，而不是第一次呢？獲取元素的最後一次出現

<!DOCTYPE html> 
<html> 
<body> 

<button onclick="getLast()">Click me</button> 

<div id="username">Lisa</div> 
<div id="username">Chris</div> 

<script> 
function getLast() { 
    alert(document.getElementById("username").innerHTML); 
} 
</script> 

</body> 
</html>

來源

2017-10-14 livin_amuk

id始終是唯一的。沒有兩個DOM元素可以具有相同的ID。在你的情況下使用class屬性。使用getElementsByClassName將返回一個集合。獲取其長度並使用該值獲取最後一個元素。

function getLast() { 
 
    var getLastElemIndex = document.getElementsByClassName("username").length - 1; 
 
    console.log(getLastElemIndex) 
 
    alert(document.getElementsByClassName("username")[getLastElemIndex].innerHTML); 
 
}

<div class="username">Lisa</div> 
 
<div class="username">Chris</div> 
 
<button onclick="getLast()">Click me</button>

來源

2017-10-14 06:38:07 brk

一個HTML元素的id意味着是唯一的。你應該指定class代替：

<div class="username">Lisa</div> 
<div class="username">Chris</div>

然後使用Document.getElementsByClassName()來獲取class的所有元素：

var usernames = document.getElementsByClassName("username");

或者，你可以使用Document.querySelectorAll()：

var usernames = document.querySelectorAll(".username");

然後您就可以得到最後一個：

var lastUsername = usernames[usernames.length - 1];

來源

2017-10-14 06:42:27

id應該是唯一的。但是，我們並沒有對人們如何寫自己的代碼，我有時也符合這種情況下控制：「我需要解析的頁面和他們使用相同的ID」

你可以把id作爲一個屬性，並使用querySelectorAll：

<button onclick="getLast()">Click me</button> 
 
<div id="username">Lisa</div> 
 
<div id="username">Chris</div> 
 
<script> 
 
function getLast() { 
 
    tags = document.querySelectorAll('[id="username"]'); 
 
    alert(tags[tags.length - 1].innerHTML); 
 
} 
 
</script>

而最好的做法應該使用class。

來源

2017-10-14 06:52:10 CtheSky

即使您可以通過標記名稱div來執行此操作，因爲@brk表示ID必須是唯一的。

function getLast(){ 
 
    var divs = document.querySelectorAll("div"); 
 
    console.log(divs[divs.length - 1].textContent); 
 
} 
 
getLast();

<button onclick="getLast()">Click me</button> 
 
<div>Lisa</div> 
 
<div>Chris</div>

來源

2017-10-14 06:54:21

獲取元素的最後一次出現

回答

相關問題