0

私は LI の UL を持っており、それぞれに IMG と短いテキストを含む SPAN が含まれており、誰かが IMG の上にマウスを置いた場合に SPAN を表示することを意図した私のコードは、TEXT ノードのみを探して見つけています。

ある時点までのコードは次のとおりです。

drag.mousemove = function (event) {
   if (event == null) {
       event = window.event;
   }
   var lowest_distance = +Infinity;
   var lowest_distance_index = null;
   var root = document.getElementById('path1');
   if (!root) {
       return;
   }
   var intermediate = root.childNodes;
   var images = [];
   var best_image = null;
   for (var outer = 0; outer < intermediate.length; ++outer) {
       console.log('Outer: ' + intermediate[outer].nodeName);
   }
}

そして、それが報告する唯一のものは「Outer: #text」です。path1 DIV には、ドラッグされた画像が含まれます。ブラウザの動作の観点からは、画像が正常にドラッグ アンド ドロップされ、途中で SPAN が失われたように見えます。しかし、コンソールはパス 1 の子ノードの内側のループには乗りません。私が引用したのは、"Inner:" が記録された childNodes から外部の childNode へのトラバーサルです。ログに "Inner: " が記録されたことは覚えていません。ノードの内容をログに記録したところ、それらはすべて改行と 8 つのスペースであり、タブはありませんでした。

また、HTML ソースでは、path1 の開始 DIV タグと終了 DIV タグの間のコンテンツ全体が改行と 8 つのスペースであり、タブはありません。

画像に対して機能し、(この場合) 含まれている LI をターゲット領域に移動することを目的としたドラッグ アンド ドロップを行う賢明な方法はありますが、DOM インスペクションはテキスト ノードのみを検出しますか? あるいは、最初の DOM コンテンツを認識される唯一のものとしてフリーズする理由はありますか?

4

0 に答える 0