Войти

Показать полную графическую версию : Создание таблицы

Vadikan
23-10-2004, 08:55
Доброго времени суток!

Озадачился я вопросом о создании таблицы с чередующимся фоном строк. Допустим я задаю фон каждой строки через <tr bgcolor="mycolor">. Однако, если мне надо вставить одну строку в середину таблицы, то вся последовательность фонов сбивается. Менять вручную как-то неправильно кажется, и наверняка существует решение задачи, о котором мне пока неизвестно. Может фон надо как-то иначе задавать? Подскажете?

Спасибо за внимание.

Исправлено: Vadikan, 8:56 23-10-2004
archy
23-10-2004, 12:18
к сожалению телепаты не вернулись еще из отпуска
В какой проге рисуем таблицы?
В обычных html редакторах это возможно с применением скриптования (если сие возможно), иначе никак, можно поискать специализированные тулзы для таблиц, IMHO!
vadimiron
23-10-2004, 12:52
Можно ещё с помощью CSS
Для всех TR задать в таблице стилей один цвет
А для исключений сделать свой ID, и вставлять его там, где нужен отличный от стандартного цвет
То есть это всё примерно так будет выглядить:

<tr></tr> - здесь будет стандартный цвет
<tr id=other_color></tr> - а здесь НЕстандартный
archy
23-10-2004, 15:00
vadimiron
И чем это отличается от bgcolor='mycolor' ?
mar
23-10-2004, 15:44
если страница не статическая, то генерить id с прибавлением 1 и дальше всем td с четным id назначить один цвет, с нечетным - другой (вызывая соответствующую функция bp <bоdy onLoad"=функция()">
Если статика - хуже. Можно все-таки попробовать генерировать id строчек атоматически (например, задействовав какую-то JavaScript переменную и загоняя туда id=эта переменная ++), а дальше, как выше, но сдается мне, что эта самая JavaScript-овская генерация не такой простой зверь, как кажется =(
vadimiron
23-10-2004, 15:45
archy
Так в этом то и есть смысл CSS, например у меня 100 ячеек, и вдруг захотелось изменить у них bgcolor, тогда я вместо того, что руками меняю у каждой ячейки bgcolor='mycolor', просто лезу в файл со стилями и изменяю всего один параметр и всё
Это намного удобней и более читабельно
mar
23-10-2004, 16:00
я тут еще подумала (насчет автоматического генерации id для статических таблиц) - может быть проще будет воспользоваться id таблицы и поиграть свойствами firstchild и т.д. (но только для броузеров, понимающих DOM)

vadimiron
проблема в том, что, судя по всему, Вад хочет создать табличку (строк эдак на полтораста, а потом вставить туда строку, скажем между 75 и 76-ой (раздвинуть ряды) и не хочет переписывать не свойства, ни id у всех рядов с 77 по 150)
archy
23-10-2004, 16:40
vadimiron
Ту не внимательно прочитал вопрос видимо :)
mar
может Javascript пробежаться по всей таблице (<tr>) и разукрасить ее как надо? Или мы об одном и том же?
/me погряз в скриптовании...
mar
23-10-2004, 16:49
archy
об одном =)
придумала (только это для броузеров, поддерживающих DOM):

<html>
<head>
<title>test</title>
<script>
<!--
 function color_trs() {

var table = document.getElementById("t");

var trs = table.getElementsByTagName("tr");
var count = trs.length;
for (var i = 0; i < count; i++) {
if (Math.round(i/2) == (i/2) )
trs[i].style.backgroundColor="blue";
else
trs[i].style.backgroundColor="yellow";
}        

}
// -->
</script>
</head>
<BODY onLoad="color_trs();">

<table id="t" border="5">
<tr><td>1</td><td>2</td></tr>
<tr><td>4</td><td>5</td></tr>
       <tr><td>7</td><td>6</td></tr>
<tr><td>8</td><td>9</td></tr>
<tr><td>10</td><td>11</td></tr>
</table>

</body>
</html>


результат можно глянуть тут (http://195.131.122.198:8080/~mar/table.html)

Добавлено:

вот та же функция, но работающая для всех таблиц документа:
 function color_trs() {
       
       var trs, trs_count, j;
       // массив элементов с именем тега table
      var tables = document.getElementsByTagName("table");
     var tables_count = tables.length;
     for (var i = 0; i < tables_count; i++) { // для каждой таблицы
       // массив элементов с именем тега tr
       trs = tables[i].getElementsByTagName("tr");
       trs_count = 0;
       trs_count = trs.length;
       for (j = 0; j < trs_count; j++) { // для каждой строки
                      // назначаем четным и нечетным разные цвета фона
                    if (Math.round(j/2) == (j/2) )
            trs[j].style.backgroundColor="blue";
                   else
trs[j].style.backgroundColor="yellow";
       }        
   }
}

пример можно посмотреть тут (http://195.131.122.198:8080/~mar/02.html)

(что-то какая-то ерунда с форматированием кода, ну да ладно - желающие могут брать его из примеров)

Исправлено: mar, 18:05 23-10-2004
Vlad Drakula
23-10-2004, 20:47
мне тоже очень интересен этот вопрос тоже очень интересен, но вот а если браузер не поддерживает дом и если не хочентся это прописывать в ПХП скриптах?
mar
23-10-2004, 21:32
Vlad Drakula
DOM первого уровня (а тут применялся только он) поддерживается в Netscape >=6 (и, соответственно Mozilla (я проверила на Mozilla 1.4b - *сборка - Gecko/20030507)) , Explorer>= 5, Konqueror, *а также Opera >= 4 с ограничениями, но в уже довольно старой опере 7.0 этот скрипт идет (о тестированиии броузеров уже позовчерашнего =) дня на совместимость с getElementsByTagName() можно почитать тут (http://www.webprogramming.boom.ru/koch/version5.html)) Так что при всем моем уважению к кроссброузерности, сейчас (причем уже пару лет как), похоже, можно смело писать подобного рода функции, добавив для собственного спокойствия в начало что-нибудь вроде if(!getElementsByTagName())
* * *retutn true;
(хотя NN4,7 и Opera5 не возмущались и без этого, хотя и таблицы, понятное дело не красили =))
Ну, или поупражняйся с document.write (хотя по-моему будет кривовато получится, если вообще выйдет)

Исправлено: mar, 21:35 23-10-2004
FADE
23-10-2004, 22:10
mar
DOM - это динамическая объектная модель? можно поподробней об этом?:) :biglaugh:
mar
23-10-2004, 22:31
FADE
Могу ведь и послать... *на w3.org:biglaugh:
Про DOM очень хорошая статья была у PPK (Peter-Paul Koch ) Тут (http://www.quirksmode.org/dom/intro.html) нынешний адрес статьи. *А выше я уже давала ссылку на ее перевод (http://www.webprogramming.boom.ru/koch/dom1.html) (когда-то меня хватило на перевод нескольких статей, а потом текучка заела :( - все те, которые несколько, лежат там же (http://www.webprogramming.boom.ru/) )
Почитай - там, в общем, достаточно подробно =)
Еще там дана очень важная вещь - сводные таблицы (http://www.quirksmode.org/dom/contents.html) совместимости (Compatibility tables) * объектов DOM в разных броузерах. То, что я перводила на русский касается более старых броузеров, - но может быть, именно по-этому и стоит посмотреть (http://www.webprogramming.boom.ru/koch/version5.html)
Vadikan
23-10-2004, 23:05
Ого! Вебмастера разошлись :) Большое спасибо всем за ответы.
оффтопик: к сожалению телепаты не вернулись еще из отпуска
В какой проге рисуем таблицы? Я правильно связал оффтопик с вопросом? Хм... а разве есть принципиальная разница в подходе к решению проблемы? Что ж... в Блокноте :)  Если же речь о том, статическая таблица или нет, то критику принимаю: статическая.
проблема в том, что, судя по всему, Вад хочет создать табличку (строк эдак на полтораста, а потом вставить туда строку, скажем между 75 и 76-ой (раздвинуть ряды) и не хочет переписывать не свойства, ни id у всех рядов с 77 по 150)Именно, ну пусть количество строк поменьше. Оно относительно невелико, и можно руками переписывать. А что если мне раз в неделю надо делать это? Отсюда и вопрос возник.
придумала (только это для броузеров, поддерживающих DOM): Вот именно что-то такое я и ожидал увидеть. Просто писать var count = trs.length;
for (var i = 0; i < count; i++) {
if (Math.round(i/2) == (i/2) )
trs[i].style.backgroundColor="blue";
else
trs[i].style.backgroundColor="yellow";
}         такие вещи я не умею :( Что же касается совместимости с браузерами, то любой человек не обновлявший браузер более года элементарно рискует получить большие проблемы из-за уязвимостей браузера. Так что некорректное отображение страниц в старых браузерах меня мало волнует.

Я попробую применить это к моей таблице и сообщу о рез-татах.  
Vlad Drakula
24-10-2004, 09:04
Vadikan
ты не совсем прав, у меня все динамическое просто мне с одной стороны не хочется лесть в код, а стругой стороны я борюсь за чистоту кода!
Vadikan
24-10-2004, 10:59
Vlad Drakula
Хм.... как прикажешь тебя понимать, Саид? (с) Белое солнце пустыни
Vadikan
29-10-2004, 02:19
Ок, я все сделал (http://unattended.oszone.net/xpcreate_ini.shtml). Все получилось именно так, как я и задумывал, задавая вопрос :) Спасибо, mar!
Vlad Drakula
29-10-2004, 18:36
Vadikan
а почему все статика а не динамика?
Vadikan
29-10-2004, 21:56
Vlad Drakula
Банальный ответ - потому, что не умею иначе. Однако, если ты мне расскажешь о преимуществах динамики над статикой в моем конкретном случае, то я буду признателен.
Prisoner
30-10-2004, 02:26
Имхо она и не нужна - геморрой не стоит свеч. Одна табличка, страниц не так уж и много, а информация слабо формализуема. (Простите, что вмешиваюсь...)



© OSzone.net 2001-2012