Перебрать каждую ячейку таблицы
Нужно проверить чтобы все ячейки таблицы имели один и тот же цвет.
Как получить свойство ксс я знаю, а вот как выбрать каждый элемент и сравнить его с цветом, например, первой ячейки первой строки я не знаю. В js я просто брал и массивом перегонял. А здесь как? |
Neo54213,
http://api.jquery.com/each/ |
<html> <head> </head> <body> <table> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> <tr><td>rerer</td><td style='background-color:red;'>rerer</td></tr> </table> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> $("table td").each(function(i){ if($(this).css("background-color") !== $("table td").eq(1).css("background-color")) alert('элемент'+i+' другого цвета'); }); </script> </body> </html> |
Спасибо за ответы. На всякий случай размещу как у меня получилось
var flag = 1; $('#array td').each(function(){ var p = 0; if($(this).css('background-color') != $('#array td:first').css('backgroundColor')){ flag = 0; } }); if(flag == 1) { $('#array td').css('background-color', 'white'); } |
не обязательно заново красить всю таблицу, можно закрасить тот элемент который другого цвета.
$('#array td').each(function(){ var p = 0; if($(this).css('background-color') != $('#array td:first').css('backgroundColor')){ $(this).css('background-color', 'white'); } }); |
j0hnik,
алгоритм такой: если все ячейки одного цвета, сделать их белого цвета. <!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(function() { var h = $("h2"); $("table").each(function(indx, table) { var arr = $("td", table).get(), color = $(arr[0]).css("backgroundColor"), flag = arr.every(function(el) { return $(el).css("backgroundColor") == color }); flag && $(arr).css({ "background-color": "white" }); h.eq(indx).text(flag ? "ready" : "wait") }) }); </script> </head> <body> <h2></h2> <table> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> </table> <h2></h2> <table> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> <tr><td style='background-color:red;'>rerer</td><td style='background-color:red;'>rerer</td></tr> <tr><td >rerer</td><td style='background-color:red;'>rerer</td></tr> </table> </body> </html> |
Рони, Ок!
|
Часовой пояс GMT +3, время: 14:28. |