的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在某些特定元素的变化风格

回答

相关问题