jquery - 如何使用 jquery 改变 HTML 元素的位置

标签 jquery html css positioning

我有以下 HTML:

<div id="ServiceProvider" class="main_filter" name="filterDiv">
    <div class="filter_chkbox_div" style="display:none">
       <label class="ATT">AT&amp;T</label>
    </div>
    <div class="filter_chkbox_div" style="display:none">
       <label class="CABLEONE">Cable One</label>
    </div>
    <div class="filter_chkbox_div" style="display:none">          
       <label class="CABLEONEv6">Cable Onev6</label>
    </div>
    <div class="filter_chkbox_div" style="display:none">
        <label class="CHARTER">Charter</label>
    </div> 
</div>

在运行时,我只显示我在数组 providerCodes 中收到的那些标签

jQuery 代码

for (var i = 0; i < providerCodes.length; i++) {
    var providerCheckBox = $("#" + providerCodes[i]);
    if (providerCheckBox.length > 0) {
        $(providerCheckBox).parent().show();
    }
}

现在我想根据我在 providerCodes 中收到的顺序放置这些标签。例如,如果 providerCodes 数组在第 0 个索引上包含 CHARTER 并且在第一个索引上包含 CABLEONE,我想相应地更改这些标签的位置。目前,它将首先显示 CABLEONE,然后显示 CHARTER。我如何在 jQuery 中执行此操作?

最佳答案

我会这样做(前提是您有容器的 div 选择器):

var containerSelector = $("<container-selector>");
for (var i = 0; i < providerCodes.length; i++) {
   var providerCheckBox = $("#" + providerCodes[i]);
   if (providerCheckBox.length > 0) {
       $(providerCheckBox).parent().show().detach().appendTo(containerSelector);
   }
}

关于jquery - 如何使用 jquery 改变 HTML 元素的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37435104/

相关文章:

javascript - 使用 jQuery XML 解析选定的元素

html - div#gallery 没有显示

jquery - 在页面其余部分之前加载 Logo ,然后 move 到静止位置并显示其余内容

ASP.NET - 如何使用 CSS 在数据输入情况下对齐 ASP.NET 控件?

Jquery 验证和 Summernote

javascript - 复制到剪贴板并在 Excel 中呈现为链接

javascript - hide.bs.modal 在 Bootstrap 3.2 w/Django 1.6.5 中未触发(远程模式内容)

javascript - 使用 angularJS 自定义弹出窗口

css - Angular 2如何在幻灯片中淡化页面的其余部分

html - css 禁用/空行而不使用显示 : none