Удалить и повторить div из DOM по разрешению с помощью jQuery .detach () - PullRequest
Новая
       1

Удалить и повторить div из DOM по разрешению с помощью jQuery .detach ()

0 голосов
/ 11 января 2020

Я хочу удалить группу DIV со специальным разрешением (например, 480 пикселей) из DOM. У меня есть две проблемы с моим сценарием:

  1. Он может удалять мои div, как я хочу, но не повторять их.
  2. Кажется, что он запускается все время - это то, что правильный путь?

Мой сценарий: 

$(window).resize(function(){
    var MobileTable = $( ".container" ).length;

    if ($('body').outerWidth() <= 480 ){
        if (MobileTable) {
            $(".container").detach();
        }
    }

    else if ($('body').outerWidth() > 480 ){
        if (!MobileTable) {
            $(".wrapper").append(MobileTable);
        }
    }
});

Мой HTML: 

<div class="wrapper">
  <div class="container">
    <div class="box">Hello 1
      <span class="content">Some Content</span>
    </div>
    <div class="box">Hello 2
      <span class="content">Some Content</span>
    </div>
  </div>
</div>

Моя скрипка:

https://jsfiddle.net/3gajduyh/3/

И основной вопрос c - выполняется ли удаление DOM до полной загрузки страницы или нет (если я добавляю его в раздел <head>)?

1 Ответ

1 голос
/ 11 января 2020

Нам необходимо присвоить метод detach () переменной! 

$(window).resize(function(){
    var MobileTable = $( ".container" ).length;

    if ($('body').outerWidth() <= 480 ){
        if (MobileTable) {
            revoke=$(".container").detach();
        }
    }

    else if ($('body').outerWidth() > 480 ){
        if (!MobileTable) {
            $(".wrapper").append(revoke);
        }
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrapper">
  <div class="container">
    <div class="box">Hello 1
      <span class="content">Some Content</span>
    </div>
    <div class="box">Hello 2
      <span class="content">Some Content</span>
    </div>
  </div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...