我想在這里獲取輸入 ID 并使用它來將輸入顏色更改為灰色。然后對其他帶有綠色的輸入重復該程序
var getGreenColor = document.getElementsByClassName("my_inputs")[0].style.color;
if (getGreenColor == "green") {
console.log("green")
}
else console.log(getGreenColor)<input type="text" style="color: green;" id="1" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="2" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="3" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="4" class="my_inputs" value="stuff">uj5u.com熱心網友回復：
因此，據我了解，您想將所有帶有綠色文本的輸入更改為灰色。如果是這種情況，您可能希望通過執行以下操作來獲取相關元素：
var greenInputsArray = document.getElementsByClassName("my_inputs");
然后你可以遍歷陣列，如果顏色是綠色，你可以將顏色更改為灰色，如下所示：
for (var i = 0; i < greenInputsArray.length; i ) {
if(greenInputsArray[i].style.color == "green") {
greenInputsArray[i].style.color = "grey";
}
}
uj5u.com熱心網友回復：
只需使用
var elements = document.getElementsByClassName('my_inputs');
for (let a=0; a < elements.length; a ) {
if (elements[a].color == 'green') {
elements[a].color = 'grey';
}
}
這將回圈遍歷元素，如果它是綠色的，則將其變為灰色。
uj5u.com熱心網友回復：
如果您的顏色始終設定為行內，您也可以使用 css 屬性選擇器：
input[style="color: green;"]:first-of-type {
background: red;
}<input type="text" style="color: green;" id="1" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="2" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="3" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="4" class="my_inputs" value="stuff">uj5u.com熱心網友回復：
你需要 style.color 或 getComputedStyle
如果不是行內，則 style.color 是未定義的
const getColor = ele => ele.style.color || window.getComputedStyle(ele).color;
document.querySelectorAll(".my_inputs").forEach((ele,i) => {
const color = getColor(ele);
console.log(i,color)
if (color === "green" || color === "rgb(0, 128, 0)") {
ele.style.color = "grey"
}
})#id1 {
color: green;
}<input type="text" style="color: green;" id="id2" class="my_inputs" value="stuff" />
<input type="text" id="id1" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="id3" class="my_inputs" value="stuff">
<input type="text" style="color: red;" id="id4" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="id5" class="my_inputs" value="stuff">轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/392777.html
標籤：javascript html css
上一篇：如何在Java中重新定位或重新排序JSON物件或哈希映射中的鍵
下一篇：如何在HTML中呼叫此函式？