Простое переупорядочение DIV внутри родительского элемента с помощью метода appendTo jQuery - PullRequest
Новая
       7

Простое переупорядочение DIV внутри родительского элемента с помощью метода appendTo jQuery

1 голос
/ 20 октября 2011

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

Ограничения: я не могу коснуться разметки, кроме как добавить классы и идентификаторы или оболочки (я не могу реструктурироватьHTML на всех).Это для существующего работающего продукта, который уже используется несколькими разными клиентами.

Вот разметка с удаленным содержимым: 

<!-- content-panel 2 -->
<div id="home-messages-box" class="content-panel">
    <table cellspacing="0">
        <tr>
            <td class="tableCaption">
            </td>
        </tr>
    </table>
    <table class="tableContent" cellpadding="0" cellspacing="0">
        <tr>
            <td>
            </td>
        </tr>
    </table>
</div>

<!-- content-panel 3 -->
<div id="home-programs-box" class="content-panel">
    <table cellspacing="0">
        <tr>
        </tr>
    </table>
    <table class="tableContent" cellpadding="3" cellspacing="3">
        <tr>
            <td>
            </td>
        </tr>
    </table>
</div>

<!-- content-panel 4 -->
<div id="home-actionitems-box" class="content-panel">
    <table cellspacing="0">
        <tr>
            <td class="tableCaption">
            </td>
        </tr>
    </table>
    <table class="tableContent" cellpadding="0" cellspacing="0">
        <tr>
            <td>
            </td>
        </tr>
        <tr>
            <td>
            </td>
        </tr>
    </table>
</div>
</div><!-- content-panel-wrapper -->

А вот jQuery I'mс помощью переупорядочивания этих элементов Div после загрузки страницы: 

$(function () { 
    $("#home-actionitems-box").appendTo("#content-panel-wrapper");
    $("#home-welcome-box").appendTo("#content-panel-wrapper");
    $("#home-messages-box").appendTo("#content-panel-wrapper");
    $("#home-programs-box").appendTo("#content-panel-wrapper");
});

Существует ли более простой и элегантный способ сделать это?Я согласен с тем, что это, вероятно, хакерское решение для негибкой структуры, которая является результатом отсутствия дизайна UI / UX в начале проекта (несколько лет назад).Но меня интересует мнение других людей, которым иногда приходится придумывать нечеткие решения подобных проблем.

...