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