Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.11.2013, 13:49
Интересующийся
Отправить личное сообщение для Зыкин Илья Посмотреть профиль Найти все сообщения от Зыкин Илья
 
Регистрация: 11.08.2013
Сообщений: 17

Динамическое удаление элемента
Здравствуйте.
Подскажите пожалуйста.

Есть такой кусочек кода:

var d=document.createElement('div');
d.style.width='100%';
d.style.height='20px';
d.style.background=' lightgreen ';
document.body.appendChild(d);
var li = document.createElement('LI')
li.innerHTML = j+' Вопрос: верно'
d.appendChild(li)


Как теперь при нажатии в на кнопку удалять этот div со всем что внутри.
И возможно ли вообще?
Делаю маленький тест, и нужно очищать внизу поле с правильно/не правильно, чтобы если много раз нажимают, не накапливалось.
Ответить с цитированием
  #2 (permalink)  
Старый 29.11.2013, 13:55
Аватар для lord2kim
Профессор
Отправить личное сообщение для lord2kim Посмотреть профиль Найти все сообщения от lord2kim
 
Регистрация: 03.05.2011
Сообщений: 848

Зыкин Илья,
зависит от задачи...будет ли этот div единственный или их может быть много...
d.id = "id";

<input type="button" value="Delete" onClick="javascript:document.getElementById('id').parentNode.removeChild(d);">

приведите HTML и остальную часть JS
Ответить с цитированием
  #3 (permalink)  
Старый 29.11.2013, 16:21
Интересующийся
Отправить личное сообщение для Зыкин Илья Посмотреть профиль Найти все сообщения от Зыкин Илья
 
Регистрация: 11.08.2013
Сообщений: 17

Просьба сильно не критиковать сам способ реализации, ибо профан.

Но буду очень благодарен конкретным примерам как лучше и почему(особенно советам, как сократить и оптимизировать код).
И что можно, а чего не стоит использовать.

Приведу весь документ:
<html>
	<head>
		<title>Тест</title>
		<script>
			function voprtrue() 
			{
				var check;
				var j;
				var i;
				
				for (j=1; j<4; j++)
				{
					var d=document.createElement('div');
					d.style.width='100%';
					d.style.height='20px';
					
					check = 0;
					
					for (i=0; i<document.getElementsByName("v"+j+"").length; i++) 
					{
						if (document.getElementsByName("v"+j+"")[i].checked) 
						{
							check = 1;
							
							if (document.getElementsByName("v"+j+"")[i].value == 1)
							{
								d.style.background=' lightgreen ';
								document.body.appendChild(d);
								var li = document.createElement('LI')
								li.innerHTML = j+' вопрос: верно'
								d.appendChild(li)
							}
							else
							{
								d.style.background=' red ';
								document.body.appendChild(d);
								var li = document.createElement('LI')
								li.innerHTML = j+' вопрос: не верно'
								d.appendChild(li)
							}
						}
					}
					if (check == 0)
					{
						d.style.background=' #B1BBC6 ';
						document.body.appendChild(d);
						var li = document.createElement('LI')
						li.innerHTML = j+' вопрос: пропущен!'
						d.appendChild(li)
					}
				}
			}
		</script>
	</head>
	<body>
		<div id="questions">
			<p>Медиа-мониторинг это ...<br></p>
			<input name=v1 type="radio">это отслеживание ключевых слов и выражений по открытым источникам, подобранных профессионалами по заказу клиента.<br>
			<input name=v1 type="radio" value="1">Это круглосуточный просмотр медиа-файлов<br>
			<input name=v1 type="radio">Это наблюдение за статистикой просмотров медиа-контента в сети<br>
			<input name=v1 type="radio">Анализ медиа-контента на сайте<br>
			<hr>

			<p>Медиа-мониторинг это ...<br></p>
			<input name=v2 type="radio" value="1">это отслеживание ключевых слов и выражений по открытым источникам, подобранных профессионалами по заказу клиента.<br>
			<input name=v2 type="radio">Это круглосуточный просмотр медиа-файлов<br>
			<input name=v2 type="radio">Это наблюдение за статистикой просмотров медиа-контента в сети<br>
			<input name=v2 type="radio">Анализ медиа-контента на сайте<br>
			<hr>

			<p>Медиа-мониторинг это ...<br></p>
			<input name=v2 type="radio">это отслеживание ключевых слов и выражений по открытым источникам, подобранных профессионалами по заказу клиента.<br>
			<input name=v2 type="radio">Это круглосуточный просмотр медиа-файлов<br>
			<input name=v2 type="radio">Это наблюдение за статистикой просмотров медиа-контента в сети<br>
			<input name=v2 type="radio" value="1">Анализ медиа-контента на сайте<br>
			<hr>
		</div>

		<button onclick="voprtrue();">Закончить тест</button>
	</body>
</html>

Последний раз редактировалось Зыкин Илья, 29.11.2013 в 16:31.
Ответить с цитированием
  #4 (permalink)  
Старый 29.11.2013, 17:21
Аватар для lord2kim
Профессор
Отправить личное сообщение для lord2kim Посмотреть профиль Найти все сообщения от lord2kim
 
Регистрация: 03.05.2011
Сообщений: 848

Сообщение от Зыкин Илья Посмотреть сообщение
Просьба сильно не критиковать сам способ реализации, ибо профан.

Но буду очень благодарен конкретным примерам как лучше и почему(особенно советам, как сократить и оптимизировать код).
И что можно, а чего не стоит использовать.

Приведу весь документ:
<html>
	<head>
		<title>Тест</title>
		<script>
			function voprtrue() 
			{
				var check;
				var j;
				var i;
				if (document.getElementById("id1")) {
					return alert("Результаты уже отображены");
                                } else {
				for (j=1; j<4; j++)
				{
					var d=document.createElement('div');
					d.id = "id"+j;
					d.style.width='100%';
					d.style.height='20px';
					
					check = 0;
					
					for (i=0; i<document.getElementsByName("v"+j+"").length; i++) 
					{
						if (document.getElementsByName("v"+j+"")[i].checked) 
						{
							check = 1;
							
							if (document.getElementsByName("v"+j+"")[i].value == 1)
							{
								d.style.background=' lightgreen ';
								document.body.appendChild(d);
								var li = document.createElement('LI')
								li.innerHTML = j+' вопрос: верно'
								d.appendChild(li)
							}
							else
							{
								d.style.background=' red ';
								document.body.appendChild(d);
								var li = document.createElement('LI')
								li.innerHTML = j+' вопрос: не верно'
								d.appendChild(li)
							}
						}
					}
					if (check == 0)
					{
						d.style.background=' #B1BBC6 ';
						document.body.appendChild(d);
						var li = document.createElement('LI')
						li.innerHTML = j+' вопрос: пропущен!'
						d.appendChild(li)
					}
				}
                                }
			}
			function deleteResults() {
				for (j=1; j<4; j++) {
				document.getElementById("id"+j).parentNode.removeChild(document.getElementById("id"+j));
				}
			}
		</script>
	</head>
	<body>
		<div id="questions">
			<p>Медиа-мониторинг это ...<br></p>
			<input name=v1 type="radio">это отслеживание ключевых слов и выражений по открытым источникам, подобранных профессионалами по заказу клиента.<br>
			<input name=v1 type="radio" value="1">Это круглосуточный просмотр медиа-файлов<br>
			<input name=v1 type="radio">Это наблюдение за статистикой просмотров медиа-контента в сети<br>
			<input name=v1 type="radio">Анализ медиа-контента на сайте<br>
			<hr>

			<p>Медиа-мониторинг это ...<br></p>
			<input name=v2 type="radio" value="1">это отслеживание ключевых слов и выражений по открытым источникам, подобранных профессионалами по заказу клиента.<br>
			<input name=v2 type="radio">Это круглосуточный просмотр медиа-файлов<br>
			<input name=v2 type="radio">Это наблюдение за статистикой просмотров медиа-контента в сети<br>
			<input name=v2 type="radio">Анализ медиа-контента на сайте<br>
			<hr>

			<p>Медиа-мониторинг это ...<br></p>
			<input name=v2 type="radio">это отслеживание ключевых слов и выражений по открытым источникам, подобранных профессионалами по заказу клиента.<br>
			<input name=v2 type="radio">Это круглосуточный просмотр медиа-файлов<br>
			<input name=v2 type="radio">Это наблюдение за статистикой просмотров медиа-контента в сети<br>
			<input name=v2 type="radio" value="1">Анализ медиа-контента на сайте<br>
			<hr>
		</div>

		<button onclick="voprtrue();">Закончить тест</button><button onclick="deleteResults();">Удалить результаты</button>
	</body>
</html>


но лучше рисуй все свои div-ы на каком-нибудь общем div-е...
Ответить с цитированием
  #5 (permalink)  
Старый 29.11.2013, 17:41
Интересующийся
Отправить личное сообщение для Зыкин Илья Посмотреть профиль Найти все сообщения от Зыкин Илья
 
Регистрация: 11.08.2013
Сообщений: 17

Большое спасибо.
Ответить с цитированием
  #6 (permalink)  
Старый 30.11.2013, 15:19
Интересующийся
Отправить личное сообщение для Зыкин Илья Посмотреть профиль Найти все сообщения от Зыкин Илья
 
Регистрация: 11.08.2013
Сообщений: 17

Чтобы не плодить темы, спрошу тут же.

Есть у меня в том же скрипте условие

if (document.getElementsByName("v"+j+"")[0].value < tr_max)
{
...
}


Но не работает условие, я так понимаю из за того что он не понимает что это числа?
Как ему указать что
document.getElementsByName("v"+j+"")[0].value и tr_max это числа?

P.S. Переменная tr_max объявлена сверху и присвоено значение 50
var tr_max = 50;
В document.getElementsByName("v"+j+"")[0].value ввожу число.
Ответить с цитированием
  #7 (permalink)  
Старый 30.11.2013, 16:40
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,428

Сообщение от Зыкин Илья Посмотреть сообщение
Но не работает условие, я так понимаю из за того что он не понимает что это числа?
не правильно понимаете, нужно смотреть код...
Ответить с цитированием
  #8 (permalink)  
Старый 30.11.2013, 17:08
Аватар для lord2kim
Профессор
Отправить личное сообщение для lord2kim Посмотреть профиль Найти все сообщения от lord2kim
 
Регистрация: 03.05.2011
Сообщений: 848

Сообщение от Зыкин Илья Посмотреть сообщение
Чтобы не плодить темы, спрошу тут же.

Есть у меня в том же скрипте условие

if (document.getElementsByName("v"+j+"")[0].value < tr_max)
{
...
}


Но не работает условие, я так понимаю из за того что он не понимает что это числа?
Как ему указать что
document.getElementsByName("v"+j+"")[0].value и tr_max это числа?

P.S. Переменная tr_max объявлена сверху и присвоено значение 50
var tr_max = 50;
В document.getElementsByName("v"+j+"")[0].value ввожу число.
<script language="JavaScript">
var tr_max = 50;
function func() {
if (document.getElementById("id").value < tr_max) { alert("значение элемента < tr_max"); }
}
</script>
<input type="text" id="id" onkeypress="func()">

...getElementsByName("v"+j+"")[0]...

+"" абсолютно не к чему
Ответить с цитированием
  #9 (permalink)  
Старый 30.11.2013, 18:53
Интересующийся
Отправить личное сообщение для Зыкин Илья Посмотреть профиль Найти все сообщения от Зыкин Илья
 
Регистрация: 11.08.2013
Сообщений: 17

Ну да, я тоже думал что по идее не надо, но как то не заработал скрипт в какой то момент, думал в этом дело.

Спасибо, значит тут всё нормально.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическое удаление строк таблицы Tankist Events/DOM/Window 16 03.07.2013 15:42
Удаление элемента AdDa AJAX и COMET 13 22.03.2013 12:23
Удаление элемента из HTML-списка Kostyk92 Элементы интерфейса 1 06.02.2012 21:00
удаление элемента dom Catherine Events/DOM/Window 0 28.10.2011 22:35
Массивы удаление элемента и вставка на его место другого mycoding Общие вопросы Javascript 1 19.04.2010 21:30