如何在類中使用get元素，然後在JavaScript中使用id？

我最終想要做的是找到一個具有已知類名稱的div中的鏈接並對其進行更改。我被困在正確的鏈接內容中，無法弄清楚我的錯誤。使用getElementsByClassName和getElementsByTagName似乎可以單獨使用，但在將它們一起使用時不起作用。我以前從未使用過jquery，所以我不覺得走那條路。如何在類中使用get元素，然後在JavaScript中使用id？

下面的代碼：

<div class="test"> 
<a href="http://www.google.com">LINK</a></div> 
<button onclick="myFunction()">Test it</button> 

<script> 
function myFunction() 
{ 
var x=document.getElementsByClassName("test"); 
x.getElementsByTagName("a")[0].innerHTML="Hello World"; 
document.write(x[0]); 
}; 

</script>

來源

2013-10-31 user2942844

我懷疑正確地解決這類問題實際上是爲什麼jQuery被髮明的原因。你可能想重新考慮走這條路。否則，你將需要自己編寫一個遞歸DOM遍歷，這是jQuery在舊瀏覽器中的功能。 –

澄清。 'x'是DOM元素的集合。集合沒有很多屬性。例如，他們沒有'getElementsByTagName'方法。這就是爲什麼你的代碼失敗。 David Thomas有很好的解決方案。 – 2013-10-31 20:27:07

從我有限的js/html /任何知識：一旦站點已加載，不要使用'document.write'。刪除。 –

在兼容的瀏覽器，你可以簡單地使用document.querySelector()：

var x = document.querySelector('.test > a'); 
x.innerHTML = 'Hello world';

document.querySelector返回單個元素（唯一的元素，或者第一多個元素），而（getElementsByTagName()和getElementsByClassName()）。

順便說一句，用jQuery：

$('.test > a').html('Hello world'); // sets the innerHTML of the returned elements

或者：

$('.test > a').text('Hello world'); // sets the text of the returned elements

來源

2013-10-31 20:21:16

或他可以使用jQuery;） –

他可以，但有一個強烈的暗示，他不想。 –

使用查詢選擇語法如下：

var x = document.querySelector('div.classname > p');

這將導致div.classname內的所有<p>元素。

來源

2013-12-09 22:26:41 user3084732

儘管提問者指定他/她不滿意，但在所有適當的方面，引入一些'JQuery'可能是非常有效的。沒有必要暗示可憐的編程習慣。 – qrikko

如何在類中使用get元素，然後在JavaScript中使用id？

回答

相關問題