Javascript-форум - insertBefore

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - insertBefore (https://javascript.ru/forum/misc/33917-insertbefore.html)

Vampir3

13.12.2012 23:53

insertBefore

Всё никак не могу разабраться, как работает этот способ вставки..
Есть таблица:

<table>
<tr><td><a href="#">User1</a>(1)<a href="info.aspx?name=User1" target="_blank"><img src="info.gif" border="0"></a></td></tr>
<tr><td><a href="#">User2</a>(7)<a href="info.aspx?name=User2" target="_blank"><img src="info.gif" border="0"></a></td></tr>
<tr><td><a href="#">User5</a>(4)<a href="info.aspx?name=User5" target="_blank"><img src="info.gif" border="0"></a></td></tr>
</table>

нужно вставить перед изображениями info.gif еще одну картинку -

<img src="privatemsg.gif" border="0">

но никак не получается, научите кто-нибудь)

ruslan_mart

14.12.2012 08:51

function Info()
{
   var a = document.getElementsByTagName('td');
   for(i=0;i<a.length;i++)
   {
      var b = a[i].getElementsByTagName('a')[1];
      b.innerHTML = '<img src="privatemsg.gif" border="0">'+b.innerHTML;
   }
}

Info();

рони	14.12.2012 11:04

Vampir3,
Вариант ...

<!DOCTYPE HTML>

<html>

<head>
<title></title>
</head>

<body>

<table>
<tr><td><a href="#">User1</a>(1)<a href="info.aspx?name=User1" target="_blank"><img src="http://javascript.ru/forum/images/smilies/dance3.gif" border="0"></a></td></tr>
<tr><td><a href="#">User2</a>(7)<a href="info.aspx?name=User2" target="_blank"><img src="http://javascript.ru/forum/images/smilies/dance3.gif" border="0"></a></td></tr>
<tr><td><a href="#">User5</a>(4)<a href="info.aspx?name=User5" target="_blank"><img src="http://javascript.ru/forum/images/smilies/dance3.gif" border="0"></a></td></tr>
</table>
<script type="text/javascript">
var a = document.getElementsByTagName('img'),
l = a.length-1;
for (var i=l; a[i];i--)  {
  if(a[i].src=="http://javascript.ru/forum/images/smilies/dance3.gif")
  var img =  document.createElement("img");
  img.src = "http://javascript.ru/forum/images/smilies/victory.gif"
  a[i].parentNode.insertBefore(img,a[i])
}
</script>
</body>

</html>

Vampir3

14.12.2012 19:20

в обоях случаях новая картинка попадает внутрь ссылки info.aspx, и при клике на новую картинку открывается информация, а я хотел бы придать ей другую функцию - открытие нового окна.
можно как-то вставить эту новую картинку сразу после скобок?

рони	14.12.2012 20:08

Цитата:

Сообщение от Vampir3

можно как-то вставить эту новую картинку сразу после скобок?

Vampir3,
Свойство parentNode указывает на родителя.
найдите родителя нужной ссылки и вставьте передней картинку.
Подсказка: дополните строку 23 в нужных местах.

Nikel097

12.01.2014 10:25

Можете тоже помочь?

function change1(obj)
{	
 div=document.getElementById("spoiler_body_info");
 newnode=document.createElement("span"); 
 newnode.innerHTML="<b>Подраздел:</b> <select name='smallsection' class='select'></select><br> ";
 where=document.getElementById("after_select");
 div.insertBefore(newnode,where);  		
}

<div class='spoiler_body_info' id='spoiler_body_info'>
		<b>Раздел:</b> <select name='section'  class='select' onChange='change1(this)'>
			<option value='0'>-----</option>
			<option value='1'>Авто и мототранспорт</option>
			<option value='2'>Авиация</option>
			<option value='3'>Ж/д транспорт</option>
			<option value='4'>Военная техника</option>
			<option value='5'>Флот</option>
			<option value='6'>Люди</option>
			<option value='7'>Прочее</option>
	        </select><br>
		<div id='after_select'></div>
</div>

Вставлять не хочет и все тут.

рони	12.01.2014 10:40

Цитата:

Сообщение от Nikel097

Вставлять не хочет и все тут.

хочет хочет ))) либо вы не то и нетуда вставляите

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<div class='spoiler_body_info' id='spoiler_body_info'>
		<b>Раздел:</b> <select name='section'  class='select' onChange='change1(this)'>
			<option value='0'>-----</option>
			<option value='1'>Авто и мототранспорт</option>
			<option value='2'>Авиация</option>
			<option value='3'>Ж/д транспорт</option>
			<option value='4'>Военная техника</option>
			<option value='5'>Флот</option>
			<option value='6'>Люди</option>
			<option value='7'>Прочее</option>
	        </select><br>
		<div id='after_select'></div>
</div>

<script>
 function change1(obj)
{
 div=document.getElementById("spoiler_body_info");
 newnode=document.createElement("span");
 newnode.innerHTML="<b>Подраздел:</b> <select name='smallsection' class='select'></select><br> ";
 where=document.getElementById("after_select");
 div.insertBefore(newnode,where);
}

</script>
</body>

</html>

Nikel097

12.01.2014 12:46

Все равно не работает. Я даже заново все переписал. Просто сделал скрывание через display

рони	12.01.2014 13:12

Nikel097,
код где?

Nikel097

12.01.2014 13:52

Не спасибо не надо. Я ж говорю. Раз по старому не получилось, то сделал через display:none; и display:block;

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