Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.05.2021, 12:43
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

Добраться до tr из input и не потерять все)
Добрый день.
В продолжении темы.

Сделал аналог для input.
var elems = document.querySelectorAll('input[value=""]');
elems.forEach(option => option.closest('tr').remove());



В итоге, удаляется самый первый <tr> и удаляет весь контент, как можно этого избежать?

Можно ли по индексу например удалять все кроме 0 или как-то еще?


Спасибо.

Последний раз редактировалось repz, 18.05.2021 в 12:56.
Ответить с цитированием
  #2 (permalink)  
Старый 18.05.2021, 13:38
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

А нельзя использовать .not(':eq(0)') для отбора?

нашел вот такую конструкцию:
Array.prototype.slice.call(document.querySelectorAll('input[value=""]'), 1)
    .forEach(elt => elt.parentNode.remove(elt))


Лучше, но все равно нужная часть удаляется)



Так. как class tr содержит tr_ , то решил вычленить по нему, в моем случае все отработало, как надо:
var elems = document.querySelectorAll('input[value=""]');
console.log(elems);
[].forEach.call(elems, function (el) {el.closest('[id*="tr_"]').remove();});

Последний раз редактировалось repz, 18.05.2021 в 14:48.
Ответить с цитированием
  #3 (permalink)  
Старый 18.05.2021, 15:19
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от repz
Можно ли по индексу например удалять все кроме 0 или как-то еще?
elems.forEach((a, b) => b && a.closest('tr').remove());
Ответить с цитированием
  #4 (permalink)  
Старый 18.05.2021, 16:20
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

Спасибо.

Не получается, closest ищет родителя родителя и получается, что все рано удаляет все содержимое.
<tr> - вот это удаляем по факту, а не должны
       <td>
                <div>
                  <table>
                   <tbody>
                    <tr></tr>
                    <tr></tr>
                    <tr></tr>
                    <tr id="tr_"> <- а должно вот это
		       <td></td>
		       <td>
	                <div>
		         <input type="text" value=""> - ищем вот это 
	                </div>
                       </td>
                     </tr>
                    </tbody>
                   </table>
                 </div>
        </td>
</tr>

Последний раз редактировалось repz, 18.05.2021 в 16:34.
Ответить с цитированием
  #5 (permalink)  
Старый 18.05.2021, 16:43
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от repz
все рано удаляет все содержимое
А что из примера должно удаляться?
Ответить с цитированием
  #6 (permalink)  
Старый 18.05.2021, 16:47
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

Должен ближайший <tr> вверх удаляться, в данном примере <tr id="tr_">, но мб и не быть id.

Наверное надо пояснить - в песочнице работает так, как должно. Пытаюсь применить на локалке, удаляет, что не нужно.
Вроде поиск жесткий и все равно где-то, что-то не так.

Последний раз редактировалось repz, 18.05.2021 в 17:04.
Ответить с цитированием
  #7 (permalink)  
Старый 18.05.2021, 18:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от repz
Не получается,
структуру надо сразу показывать ...
пробуйте

var elems = document.querySelectorAll('input[value=""]');
elems.forEach(input => input.closest('tr:last-child').remove());
Ответить с цитированием
  #8 (permalink)  
Старый 19.05.2021, 10:41
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

В браузере вот такая ощибка.
Код:
Uncaught TypeError: Cannot read property 'remove' of null
    at <anonymous>:2:54
    at NodeList.forEach (<anonymous>)
    at <anonymous>:2:7
('tr:last-child') - вот тут проблема.
Ответить с цитированием
  #9 (permalink)  
Старый 19.05.2021, 11:12
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

repz,
может у вас браузер устаревший или структура другая?
здесь код ниже работает?
<!DOCTYPE html>

<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    td{
        border: 1px solid red;
    }

    </style>

</head>

<body>
<table><tr>
       <td> - вот это удаляем по факту, а не должны
                <div>
                  <table>
                   <tbody>
                    <tr><td>test</td></tr>
                    <tr><td>test</td></tr>
                    <tr><td>test</td></tr>
                    <tr id="tr_">
               <td>del <- а должно вот это  </td>
               <td>
                    <div>
                 <input type="text" value=""> - ищем вот это
                    </div>
                       </td>
                     </tr>
                    </tbody>
                   </table>
                 </div>
        </td>
</tr>
</table>
 <script>
var elems = document.querySelectorAll('input[value=""]');
elems.forEach(input => input.closest('tr:last-child').remove());

 </script>
</body>
</html>
Ответить с цитированием
  #10 (permalink)  
Старый 19.05.2021, 11:43
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

Вот версия:
Код:
Последняя версия Google Chrome уже установлена
Версия 90.0.4430.212 (Официальная сборка), (64 бит)
Вот более точная разметка:
Удаляется 2 -ой tr.
<table>
	<tbody>
		<tr></tr>
		<tr>             <-Вот этот удаляется, а не хотелось бы.
			<td>
				<div>
					<form>
						<div>
							<div>
								<div>
									<div>
										<table>
											<tbody>
												<tr>
													<td></td>
													<td>
														<table>
															<tbody>
																<tr>
																	<td>
																		<input name="" value="" size="30" type="text"><br>
																	</td>
																</tr>
															</tbody>
														</table>
													</td>
												</tr>

												<tr>
													<td></td>
													<td>
														<select name="" size="1">
															<option value="" selected="">(нет)</option>
															<option value="">123</option>
														</select>
													</td>
												</tr>
											</tbody>
										</table>
									</div>
								</div>
							</div>
						</div>
					</form>
				</div>
			</td>
		</tr>
	</tbody>
</table>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как перетащить текст в поле input и записать его в value? firsmember Элементы интерфейса 26 17.04.2022 19:33
Получить все значения javascript обьекта! imult87 Общие вопросы Javascript 8 17.03.2017 13:37
Динамическое копирование значения из input в input с одинаковыми атрибутами name ami_moor jQuery 2 10.08.2016 17:02
Удаление значение в поле input file – в коллекции files все равно содержится файл. artur567 Events/DOM/Window 1 08.05.2016 18:00
глюк форума Gvozd Сайт Javascript.ru 11 18.03.2009 14:37