的Javascript：一個id在某些特定元素的變化風格

-1

<div class='row' id='row_1'> 
    <span></span><div style='display: inline-block;'></div> 
    <span></span><div style='display: inline-block;'></div> 
    <span></span><div style='display: inline-block;'></div> 
</div>

我想更改CSS屬性只在id='row_1'的<div>標籤或<span>標籤如果我使用如document.getElementById("row_1")：

document.getElementById("row_1").style.backgroundColor = color_code;

它根據row_1 id更改eveything的背景顏色。但我想改變一個特定的標記，如<div>或<span>的CSS屬性。我怎樣才能做到這一點？

來源

2017-09-27 Nazem Mahmud

https://developer.mozilla.org/en-US/docs/Web/API/Element/getElementsByTagName – Quentin

或[document.querySelectorAll]（https://developer.mozilla.org/en-US/）文檔/網絡/ API /文檔/ querySelectorAll） – Andreas

我希望這有助於你...

var nodes = document.getElementById('row_1').getElementsByTagName("span"); 
 
for(var i=0; i<nodes.length; i++) { 
 
    nodes[i].style.background = 'red'; 
 
}

<div class='row' id='row_1'> 
 
    <span>1</span><div style='display: inline-block;'></div> 
 
    <span>2</span><div style='display: inline-block;'></div> 
 
    <span>3</span><div style='display: inline-block;'></div> 
 
</div>

來源

2017-09-27 11:39:35 PraveenKumar

你可以做到這一點簡單的css沒有任何javascript

#row_1 > span { 
    background-color: red; 
}

來源

2017-09-27 11:43:25

你可以這樣說：

var your_div = document.getElementById('row_1'); 
 
var childNode = your_div.childNodes[1]; 
 
childNode.style.background = 'red';

<div class='row' id='row_1'> 
 
    <span>hello</span><div style='display: inline-block;'></div> 
 
    <span>hi</span><div style='display: inline-block;'></div> 
 
    <span>thank you</span><div style='display: inline-block;'></div> 
 
</div>

希望它能幫助。 :)

來源

2017-09-27 12:07:10

的Javascript：一個id在某些特定元素的變化風格

回答

相關問題