Greasemonkey脚本将元素移动到另一个元素中？ [英] Greasemonkey script to move an element into another element?

问题描述

我想移动< div> 元素。在这种情况下，交换第一个和最后一个 div.clearfix 。所以这：

I want to move <div> elements. In this case, swap the first and last div.clearfix. So this:

<fieldset>
    <div class="clearfix ">
        <label for="form-title">Title</label>
        <div class="input"></div>
    </div>
    <div class="clearfix "></div>
    <div class="clearfix ">
        <label>Verification</label>
        <div dir="ltr">
            recaptcha
        </div>
    </div>
</fieldset>

会变成这样：

Would become this:

<fieldset>
    <div class="clearfix ">
        <label>Verification</label>
        <div dir="ltr">
             recaptcha
        </div>
    </div>
    <div class="clearfix "></div>
    <div class="clearfix ">
        <label for="form-title">Title</label>
        <div class="input"></div>
    </div>
</fieldset>

我已经搜索过，但我所有的都是移动（萤幕？）位置，而不是我想要。
如何交换< div> s？

I've searched but all I've got is moving (¿screen?) position, not as I want. How do I swap those <div>s?

推荐答案

为了交换第一个和最后一个 div.clearfix s，使用
querySelector ， insertBefore 和 appendChild 函数。

To swap the first and last div.clearfixs, given that HTML, use the querySelector, insertBefore, and appendChild functions.

是一个完整的Greasemonkey脚本：
$ b

Here is a complete Greasemonkey script that does that:

// ==UserScript==
// @name     _Swap first and last div.clearfix
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @grant    none
// ==/UserScript==

var container    = document.querySelector ("fieldset");
var firstTargDiv = container.querySelector ("fieldset > div.clearfix:first-child");
var lastTargDiv  = container.querySelector ("fieldset > div.clearfix:last-child");

//-- Swap last to first.
container.insertBefore (lastTargDiv, firstTargDiv);

//-- Move old first to last.
container.appendChild (firstTargDiv);

这篇关于Greasemonkey脚本将元素移动到另一个元素中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！