javascript - プレーンJSでdivが父親から外れているかどうかを確認する方法

Question

わかりました、私はこのようなものを持っています:

<div id='father' style='width: 100%; height: 100px; position:absolute; top: 0px; left: 0px;overflow:hidden;'>
    <div id='box' style='width: 50px; height: 50px;'></div>
</div>
<script>
function FrandomBoxPos(elem){
    cuadrante = rand(1,4);
    if (cuadrante == 1){
        elem.style.top = "-"+rand(100, 200)+"px";
        elem.style.left = rand(1, document.body.offsetWidth)+"px";
    } else if (cuadrante == 2){
        elem.style.top = rand(1, document.body.offsetHeight)+"px";
        elem.style.left = rand(-300, (document.body.offsetWidth*-1)-300)+"px";
    } else if (cuadrante == 3){
        elem.style.top = rand(document.body.offsetHeight, document.getElementById('DcontenidoSubmenu').offsetHeight+100)+"px";
        elem.style.left = rand(1, document.body.offsetWidth)+"px";
    } else if (cuadrante == 4){
        elem.style.top = rand(1, document.body.offsetHeight)+"px";
        elem.style.left = rand(document.body.offsetWidth+400, document.body.offsetWidth+600)+"px";
    }
}
FrandomBoxPos(document.getElementById('box'));
</script>

ときどき、FrandomBoxPos を実行した後、彼の父親に「ボックス」が表示されることがあります (表示されるべきではありません)。したがって、「box」が「father」から外れているかどうかを確認できれば、次のようなものを作成できます。

while isOutOf('box', 'father') == false:
    FrandomBoxPos(document.getElementById('box'));

コードは次のとおりです。http://pastebin.com/bnnWLwdY jsFiddle が機能しないため、貼り付けることができません。マウスを「セクション」ボタンのいずれかに置いたままにし、ボックスが動かず、所定の位置にない場合 (赤い枠内) は、何かがおかしい場合です...