Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Добавить после каждого n элемента html код (https://javascript.ru/forum/css-html/46237-dobavit-posle-kazhdogo-n-ehlementa-html-kod.html)

MyaSniK093 02.04.2014 19:02

Добавить после каждого n элемента html код
 
Здравствуйте помогите пожалуйста в чем моя ошибка?
<script type="text/javascript">
 var colst;

function funonload() {
  if colst>3 {
  document.write('<div class="clr"></div>');
  colst=0;

  }else{ 
  colst=colst+1;
  }

});

Aetae 02.04.2014 19:05

В том, что это не javascript. Увы компьютеры пока не дошли до такого уровня, чтобы исполнять любой бред вываленный пользователем. Но не отчаивайтесь, ещё лет 15-20 и всё будет.

MyaSniK093 02.04.2014 19:10

))))
Может помножите сделать.
Дело в том что мне нужно добавить <div class="clr"></div> после кажного элемента с классом к примеру newsgl

MyaSniK093 02.04.2014 19:12

что касается моего кода его и в правду можно назвать бредом))

рони 02.04.2014 19:15

MyaSniK093,
помедитируйте тут может чем поможет

Aetae 02.04.2014 19:20

var newsgl = document.getElementsByClassName('newsgl'), i = newsgl.length,
	clr = document.createElement('clr');
	clr.className = 'clr';
while(i--){
	newsgl[i].parentNode.insertBefore(clr.cloneNode(true), newsgl[i].nextSibling || null);
}

рони 02.04.2014 19:33

:write: на всякий случай
можно без
Цитата:

Сообщение от Aetae
|| null

и
clr = document.createElement('div')

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  body{
    background-color: #D2691E;
  }

  .newsgl{
    background-color: #006400;
     height: 25px;
  }
  .clr{
    background-color: #E0FFFF;
     height: 5px;
  }
  </style>
  <script>
    window.onload = function ()
{
   var newsgl = document.getElementsByClassName('newsgl'), i = newsgl.length,
	clr = document.createElement('div');
	clr.className = 'clr';
while(i--){
	newsgl[i].parentNode.insertBefore(clr.cloneNode(true), newsgl[i].nextSibling);
}

}
  </script>
</head>

<body>
<div class="newsgl"></div>
<div class="newsgl"></div>
<div class="newsgl"></div>
</body>

</html>

Aetae 02.04.2014 19:56

рони, помню что в каком-то браузере требует строго null. Может уже не актуально конечно, но мне проще лишнего написать.)

MyaSniK093 02.04.2014 20:52

Спасибо большое за помощь всем вы очень помогли.

Aetae 02.04.2014 21:02

рони, проверил, актуально как минимум для IE<9.

рони 02.04.2014 21:25

Aetae,
а может всётаки неактуально ? может у вас ошибка на getElementsByClassName вылазит? как мог проверил даже емулятор ие6 проглотил без вопросов без null, естественно getElementsByClassName заменил для 6.

Aetae 02.04.2014 21:29

Wat?! Хреновый эмулятор у вас.)
<!DOCTYPE html> 
<body>
<script>
try{
	document.body.insertBefore(document.createTextNode('true'), undefined)
}catch(e){
	document.write(e.message)
}
</script>
</body>
<html>

http://ajitae.ru/testinsert.html
ie11
ie8

MyaSniK093 02.04.2014 21:29

Странно сделал как мне надо но для второго класса не работает и только в мазиле.
<script>
    window.onload = function ()
{
var shortstorynotfixed = document.getElementsByClassName('shortstorynotfixed'), i = shortstorynotfixed.length,
    clr = document.createElement('div');  clr.className = 'clr';    

    var j=1; while(j => i){ shortstorynotfixed[j].parentNode.insertBefore(clr.cloneNode(true), shortstorynotfixed[j].nextSibling  || null);  j=j+2;}


var cussh = document.getElementsByClassName('cusshortstorynotfixed'), x = cussh.length,
    clr = document.createElement('div'); clr.className = 'clr';

    var z=1; while(z => x){ cuss[z].parentNode.insertBefore(clr.cloneNode(true), cussh[z].nextSibling  || null); z=z+2;} 

}
  </script>

рони 02.04.2014 21:36

Aetae,
можно я всёравно поспорю ))) newsgl[i].nextSibling --- выдаст либо элемент либо null

Aetae 02.04.2014 21:38

MyaSniK093, во-первых: не пишите в одну строчку, уже завтра сами глаза сломаете.
Во-вторых: в javascript "больше или равно" >= , а не =>. Может всё-таки стоит почитать хотябы про базовый синтаксис?
В-третьих: в вашем случае нужно <=.

рони, однако.) В данном случае да, вы таки правы.
Но бывают всё-таки варианты с undefined(.childNodes[n] итд), оно видно у меня в памяти и засело.

рони 02.04.2014 21:40

MyaSniK093,
вам показали нормальный обход -- от последнего элемента к первому -- иначе при каждой вставке индекс надо будет корректировать

MyaSniK093 02.04.2014 21:46

с оператором я не доглядел, но мне надо чтоб clr добавлялся после каждого второго.
Мне это нужно для отображения новостей в 2 колонки на главной странице и при этом на ней выводиться 2 категории поэтому пришлось прибегнуть к javascript.

Aetae 02.04.2014 21:50

рони, да никуда не денутся, выбраны же по классу, а не по тегу.)
MyaSniK093, что надо поменять - я вам сказал.

MyaSniK093 02.04.2014 21:58

да это я поменял но почему то вторая часть функции не работает она даже не выполняться.

Aetae 02.04.2014 22:19

MyaSniK093, у вас опечатка cuss[z] вместо cussh[z].
Используйте редакторы с подсветкой, чтобы таких проблем не возникало.
Используйте консоль(f12), чтобы видеть в чём проблема, коли она таки возникнет.

рони 02.04.2014 22:23

Цитата:

Сообщение от Aetae
рони, да никуда не денутся, выбраны же по классу, а не по тегу.)

верно.
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  body{
    background-color: #D2691E;
  }
div{
      border: #000000 1px solid
 }

  .cusshortstorynotfixed{
    background-color: #006400;
     height: 25px;
  }
  .clr{
    background-color: #E0FFFF;
     height: 5px;
  }
  .shortstorynotfixed{
     background-color: #FFFF00;
     height: 25px;
    }

  </style>
  <script>
window.onload = function () {
           var newsgl = document.getElementsByClassName('cusshortstorynotfixed'),
               len = newsgl.length,
               i = 1,
               clr = document.createElement('div');
           clr.className = 'clr';
           while (i < len) {
               var el = newsgl[i];
               el && el.parentNode.insertBefore(clr.cloneNode(true), el.nextSibling);
               i += 2;
           };
           newsgl = document.getElementsByClassName('shortstorynotfixed'), len = newsgl.length, i = 1;
           while (i < len) {

               var el = newsgl[i];
               el && el.parentNode.insertBefore(clr.cloneNode(true), el.nextSibling);
               i += 2;
           }
       };
  </script>
</head>

<body>
<div class="cusshortstorynotfixed"></div>
<div class="cusshortstorynotfixed"></div>
<div class="cusshortstorynotfixed"></div>
<div class="cusshortstorynotfixed"></div>
<div class="cusshortstorynotfixed"></div>
<p></p>
<div class="shortstorynotfixed"></div>
<div class="shortstorynotfixed"></div>
<div class="shortstorynotfixed"></div>
<div class="shortstorynotfixed"></div>
<div class="shortstorynotfixed"></div>

</body>

</html>

MyaSniK093 02.04.2014 22:37

Я опечатку исправил сразу же но все же вторая часть кода не выполнялась почему то Спасибо большое всем за помощь все работает как дано.

MyaSniK093 02.04.2014 22:37

тема закрыта


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