Greasemonkey腳本將元素移動到另一個元素中？

Question

我想移動<div>個元素。在這種情況下，交換第一個和最後一個div.clearfix。所以這個：

<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> 

會變成這樣：

<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>？

Answer 1

要交換的第一個和最後div.clearfix S，因爲HTML，使用 querySelector，insertBefore和appendChild功能。

這裏是一個完整的Greasemonkey腳本，做的是：

// ==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);