Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   применение свойств ко всем элементам (https://javascript.ru/forum/misc/29364-primenenie-svojjstv-ko-vsem-ehlementam.html)

Vampir3 25.06.2012 14:15

применение свойств ко всем элементам
 
вообщем на странице к примеру 10 элементов <span>
как изменить цвет текста на красный сразу для всех десяти элементов?

Мишка 25.06.2012 14:29

присоединяюсь!
у меня проблема с тем что надо поменять иннер текст для 10 элементов. но конструкция:
onMouseOver="text1.innerHTML='#070';"

не работает, поскольку текст1 получается у многих элементов, а при всего одном элементе с определенным айди - всё норм.
:( помогите разобраться неразбирающемуся! пожалуйста.

bot87 25.06.2012 14:40

spans=document.getElementsByTagName('span')
for(var i=0;i<spans[i];i++){

spans[i].style.color='red'

}

bes 25.06.2012 14:43

Например, так
<style>
  .red span {color: red}
</style>
<body>

<button onclick="document.body.className = 'red'">click</button><br>

<span>text</span><br>
<span>text</span><br>
<span>text</span><br>
</body>

Dim@ 25.06.2012 15:11

Хм, я люблю использовать Traversal API ;) :)
<span>Текст1</span>
<span>Текст2</span>
<span>Текст3</span>
<span>Текст4</span>
<span>Текст5</span>
<script type='text/javascript'>
function load(){
 function spanFilter(n){
  if (n.tagName == 'SPAN') return NodeFilter.FILTER_ACCEPT;
  else return NodeFilter.FILTER_SKIP;
 }
 var spans = document.createNodeIterator(
  document,
  NodeFilter.SHOW_ELEMENT,
  spanFilter,
  false
 );
 while((span = spans.nextNode()) != null){
  span.style.color = 'red';
 }
}
setTimeout('load()', 5000);
</script>

Мишка 25.06.2012 15:20

Цитата:

Сообщение от bes (Сообщение 183920)
Например, так
<style>
  .red span {color: red}
</style>
<body>

<button onclick="document.body.className = 'red'">click</button><br>

<span>text</span><br>
<span>text</span><br>
<span>text</span><br>
</body>

&lt;span style="color: <span id="text1">red</span>;"&gt;<span id="text2" style="color: red;">ЦВЕТ :з)</span>&lt;/span&gt;
<br />
&lt;span style="color: <span id="text1">red</span>;"&gt;<span id="t2" style="color: red;">ЦВЕТ :з)</span>&lt;/span&gt;
<br />
<div>
<ul>
<li onMouseOver="text1.innerHTML='#300'; text2.style.color='#300';" style="background: #300"></li>
<li onMouseOver="text1.innerHTML='#040'; text2.style.color='#040';" style="background: #040"></li>
<li onMouseOver="text1.innerHTML='#004'; text2.style.color='#004';" style="background: #004"></li>
</ul>
</div>

во второй строке с айди текст1 был специально изменен айди текст2 на т2, что бы видно было что с единственным (так ведь и должно быть, идентификатором работает онмаусовер.

а Ваш пример я не совсем представляю как применить в моем случае, поскольку мне нужно не свойство тега менять, а именно его текст

Dim@ 25.06.2012 15:30

Мишка,
учитесь? в качестве заметки лучше используйте функцию с аргументами (если не поняли то вот пример:
<li onMouseOver="izm(this, '#300')">lll</li>
<li onMouseOver="izm(this, '#040')">lll</li>
<li onMouseOver="izm(this, '#004')">lll</li>
<script>
function izm(th, cvet){
 th.style.color = cvet;
 th.innerHTML = cvet;
}
</script>

)

Мишка 25.06.2012 15:36

должно получиться следующее
 

вот так примерно должно выглядеть.
просто у меня не меняется код цвета, т.к. несколько появляется мест куда он должен ставиться, если я правильно излагаю..

Мишка 25.06.2012 15:38

Цитата:

Сообщение от Dim@ (Сообщение 183932)
Мишка,
учитесь? в качестве заметки лучше используйте функцию с аргументами (если не поняли то вот пример:

)

я сейчас потренеруюсь, спасибо за ответы!

Dim@ 25.06.2012 15:39

Мишка,
:)


Часовой пояс GMT +3, время: 18:11.