2013-06-27 2 views
-1

Я играл с Javascript, чтобы изменить фон и тему моей страницы, http://www.gfcf14greendream.com/, чтобы он отображал другой фон в каждом сезоне, и это работает. Теперь, когда все было зеленым раньше (я такой урод), я экспериментировал, чтобы изменить цвет шрифта тегов div на читаемый цвет в зависимости от фона (сейчас я использую фиолетовый на летнем фоне, rgb(128, 0, 128) но если кто-то думает, что есть лучший цвет, дайте мне знать), и она работала, используя следующие строки:Javascript: Divs не распознается?

var divs = window.parent.document.getElementsByTagName('div'); 
for (var i = 0; i < divs.length; i++) { 
    divs[i].style.color = "rgb(128, 0, 128)"; 
} 

это работа, на этих страницах, что я изменил (я не изменил все так как я m все еще тестирование) http://www.gfcf14greendream.com/smssender.html, http://www.gfcf14greendream.com/employmentassistant.html. Но в то время как это кажется, что он работает на этой странице, http://www.gfcf14greendream.com/programs.html, дивы, которые находятся внутри таблицы не изменяются (как это Div :)

<td align="center"> 
    <div style="text-align: center; color:#00FF00; font-size: 15px"> 
     <font color="#00FF00">December 16th, 2012</font> 
    </div> 
</td> 

Так почему же дивы внутри <table> тега не распознается? Должен ли я считать столы устаревшими (кто-то сказал мне, что они злые) и попытаться отформатировать их с помощью div с помощью CSS?

+0

Не используйте javascript, делайте это только с помощью CSS. Добавьте класс сезона в тело и важное правило к .season div. – bfavaretto

+4

@bfavaretto еще лучше, избавьтесь от встроенных стилей и '' –

+0

Стиль divs переместился тегом шрифта. Кроме того, таблицы не злые, просто неправильно понятые. Тем не менее, тег шрифта * * *, а использование '! Important' в большинстве случаев неверно. – rlemon

ответ

2

на данный момент это не работает из-за метки <font>. Стиль divs затрагивается, однако тег шрифта внутри не позволяет вам видеть изменения. Удалите тег шрифта, и вы должны что-то увидеть.

С учетом этого вы не должны использовать тег <font>. W3 сообщает, что HTML5 классифицирует его как несоответствующую функцию и «... действительно, не используйте его».

+0

ok Я загляну в это завтра, так как я получаю этот совет несколько раз. Спасибо всем за ваш вклад! Я дам вам знать, как это происходит – gfcf14

+0

спасибо, это действительно связано с тегом шрифта =) – gfcf14

1

Это потому, что у этих div есть атрибуты стиля, и они переопределяют свойства, которые вы назначаете с помощью JS. Тем не менее, лучше использовать CSS вместо такой магии, как сказал @bfavaretto :)

upd. Я был не совсем прав, вещь шрифт теги имеют атрибуты «стиль», и эти свойства переопределения, которые вы назначаете их родителям, div.

+0

Это совершенно неправильно .. – rlemon

+0

Если вы задали 'style' какого-либо элемента из javascript, вы изменяете ... ну ... свой атрибут' style'. –

+0

вы знаете, я еще не пробовал это, но это похоже на хороший совет. Интересно, почему тот, кто дал вам -1, не потрудился объяснить, где ваш код может потерпеть неудачу? O_O – gfcf14

1

Вы должны действительно избегать меток шрифтов, как указал Ян Дворжак. Но даже с ними, она может быть решена только с помощью CSS:

div, div font { 
    color: rgb(128, 0, 128) !important; 
} 

Я бы также добавить класс сезона к телу (как в <body class="summer">), так что я могу создать несколько стилей в зависимости от сезона:

.summer div, .summer div font { color: rgb(128, 0, 128) !important; } 
.winter div, .winter div font { color: rgb(0, 0, 255) !important; } 
+0

Вам действительно нужно '! Important' переопределить стиль из' font'' color'? –

+1

Нет. Но я предполагаю, что разметка - это беспорядок, и просто хотел быть уверенным.Это будет отменять что-либо, кроме встроенного! Важного или важного в более высоком селекторе. – bfavaretto

0

цвет DIV изменяется, но текст не является, это потому, что текст на самом деле в «Шрифт» тега

Я вижу ваши страницы ссылки JQuery, пытаются использовать это:

$('div,div>font').css('color','rgb(128,0,128)') 
+0

Пожалуйста, не добавляйте jQuery к этому. – bfavaretto

+0

@bfavaretto jQuery 1.8.3 уже присутствует (хотя и не используется) на странице. –

+0

Ах, извините. Это не помечено jquery – bfavaretto