Javascript.RU

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

Удалить divы по условию в span.
Здравствуйте!
Есть достаточно сложная разметка для воспроизведения один в один, общий смысл такой:
<div class="delete">
   <table>
      <tbody>
         <tr>
            <td>
            </td>
            <td>
            </td>
            <td>
               <table>
                  <tbody>
                     <tr>
                        <td>
                        </td>
                        <td>
                        </td>
                     </tr>
                     <tr>
                        <td>
                        </td>
                        <td>
                        </td>
                     </tr>
                     <tr>
                        <td >
                        <td>
                        </td>
                     </tr>
                     <tr>
                        <td>
                        </td>
                        <td>
                        </td>
                     </tr>
                     <tr>
                        <div>Target blank</div>
                        </td>
                        <td>
                           <div>
                              <span content="myTarget">0</span>
                           </div>
                        </td>
                     </tr>
                  </tbody>
               </table>
            </td>
         </tr>
         <tr>
            <td>
            </td>
            <td>
            </td>
         </tr>
      </tbody>
   </table>
</div>


<div class="delete">
- Может быть неопределенное количество.
Помогите удалить все дивы delete, если
<span content="myTarget">0</span>
больше нуля.
Ответить с цитированием
  #2 (permalink)  
Старый 07.03.2021, 21:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

repz,
document.addEventListener( "DOMContentLoaded" , () => {
document.querySelectorAll("[content='myTarget']").forEach((span, i) => {
+span.textContent && (span = span.closest(".delete")) && span.remove()
} )
});
Ответить с цитированием
  #3 (permalink)  
Старый 07.03.2021, 21:31
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

Профессор, код, я уверен рабочий, но у меня не заводится.
Пытаюсь сделать вот так, но что-то не выходит пока:
let block_array = document.querySelectorAll(".delete");
for (let i = 0; i < block_array.length; i++) {
  let child = block_array[i].querySelector("[content='myTarget']");
  let value = +child.innerHTML;
console.log(value);
  if (value > 0) {
    block_array[i].innerHTML='';
  }


Удаляет все div=remove

Добавил
console.log(child);


в него приходит
<span content="myTarget">0</span>

Последний раз редактировалось repz, 07.03.2021 в 21:49. Причина: upd
Ответить с цитированием
  #4 (permalink)  
Старый 07.03.2021, 22:02
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

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

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

    <script>
document.addEventListener( "DOMContentLoaded" , () => {
document.querySelectorAll("[content='myTarget']").forEach((span, i) => {
+span.textContent && (span = span.closest(".delete")) && span.remove()
} )
});
    </script>
</head>

<body>
<div class="delete">
    <table>
        <tbody>
            <tr>
                <td>
                </td>
                <td>
                </td>
                <td>
                    <table>
                        <tbody>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td >
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <div>Target blank</div>
                                </td>
                                <td>
                                    <div>
                                        <span content="myTarget">0</span>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="delete">
    <table>
        <tbody>
            <tr>
                <td>
                </td>
                <td>
                </td>
                <td>
                    <table>
                        <tbody>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td >
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <div>Target blank</div>
                                </td>
                                <td>
                                    <div>
                                        <span content="myTarget">10</span>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                </td>
            </tr>
        </tbody>
    </table>
</div>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 07.03.2021, 22:07
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

repz,
<!DOCTYPE html>

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

    <script>
document.addEventListener( "DOMContentLoaded" , () => {
let block_array = document.querySelectorAll(".delete");
for (let i = 0; i < block_array.length; i++) {
    let child = block_array[i].querySelector("[content='myTarget']");
    let value = +child.textContent;
console.log(value);
    if (value > 0) {
        block_array[i].parentNode.removeChild(block_array[i]);
    }
  }
});
    </script>
</head>

<body>
<div class="delete">
    <table>
        <tbody>
            <tr>
                <td>
                </td>
                <td>
                </td>
                <td>
                    <table>
                        <tbody>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td >
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <div>Target blank</div>
                                </td>
                                <td>
                                    <div>
                                        <span content="myTarget">0</span>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="delete">
    <table>
        <tbody>
            <tr>
                <td>
                </td>
                <td>
                </td>
                <td>
                    <table>
                        <tbody>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td >
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                </td>
                                <td>
                                </td>
                            </tr>
                            <tr>
                                <div>Target blank</div>
                                </td>
                                <td>
                                    <div>
                                        <span content="myTarget">10</span>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                </td>
            </tr>
        </tbody>
    </table>
</div>
</body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 07.03.2021, 23:34
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

рони,
здесь все работает, у меня нет(
делаю так:
function deleteTable() {
document.addEventListener( "DOMContentLoaded" , () => {
let block_array = document.querySelectorAll(".delete");
for (let i = 0; i < block_array.length; i++) {
    let child = block_array[i].querySelector("[content='myTarget']");
    let value = +child.textContent;
console.log(value);
    if (value > 0) {
        block_array[i].parentNode.removeChild(block_array[i]);
    }
  }
});
}

function funcDelete() {
		deleteTable();
}
funcDelete()


Цепляю как расширение к chrome. При таком коде в консоль не прилетает console.log(value);

Если:
function deleteTable() {

let block_array = document.querySelectorAll(".delete");
for (let i = 0; i < block_array.length; i++) {
    let child = block_array[i].querySelector("[content='myTarget']");
    let value = +child.textContent;
console.log(value);
    if (value > 0) {
        block_array[i].parentNode.removeChild(block_array[i]);
    }
  }

}

function funcDelete() {
		deleteTable();
}
funcDelete()

то в консоль прилетает 0, но ничего не удаляет.

Если выполнить код в консоли, то отрабатывает норм.

Последний раз редактировалось repz, 07.03.2021 в 23:47.
Ответить с цитированием
  #7 (permalink)  
Старый 08.03.2021, 00:06
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

repz,
элементов нет на странице
setTimeout(deleteTable, 1000)
задержку подберите сами
Ответить с цитированием
  #8 (permalink)  
Старый 08.03.2021, 00:08
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

repz,
или так
window.addEventListener( "load" , () => {
document.querySelectorAll("[content='myTarget']").forEach((span, i) => {
+span.textContent && (span = span.closest(".delete")) && span.remove()
} )
});
Ответить с цитированием
  #9 (permalink)  
Старый 08.03.2021, 00:27
Аспирант
Отправить личное сообщение для repz Посмотреть профиль Найти все сообщения от repz
 
Регистрация: 01.12.2014
Сообщений: 59

рони,
Да, добавил setTimeout заработал))

Как всегда, огромное спасибо!
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
подскажите как удалить div alex2012 jQuery 5 13.10.2016 17:43
Удалить текст после элемента rodiony4 jQuery 2 20.03.2016 17:57
Как удалить коммит github Maxmaxmaximus6 Оффтопик 59 01.01.2014 19:42
span внутри span lamer Общие вопросы Javascript 5 11.02.2013 16:50
Не могу выбрать и удалить клонируемые элементы AlexPrm jQuery 6 30.05.2010 15:58