javascript - 如何在分离的 dom 上使用 querySelectorAll？

Question

我需要传递给 actionSorter() 方法和 HTMLCollection，我想知道如何创建一个与 DOM 分离的临时 div。

有任何想法吗？

       var temp = document.createElement('div');
        temp.className = 'temp';
        temp.dataset.href = 'zoomout';
        var coll = document.querySelectorAll('.temp');
        this.actionSorter(coll);



actionSorter: function($el) {

            var href = $el[0].dataset.href;
            if (href === 'viewup') {
                Viewer.itemAnimateUp();
            }
            if (href === 'viewright') {
                Viewer.itemAnimateRight();
            }
            if (href === 'viewdown') {
                Viewer.itemAnimateDown()
            }
            if (href === 'viewleft') {
                Viewer.itemAnimateLeft();
            }
            return false;
        },

Answer 1

您不需要这样做，querySelectorAll因为您已经拥有该元素。

是否足以通过temp元素

this.actionSorter(temp);

但是，如果您的元素更复杂，并且您想在未附加到 DOM 的临时元素中找到某些内容，则可以调用querySelectorAll该元素的方法，例如

temp.querySelectorAll(".selector")

请注意，它querySelectorAll返回一个元素数组。

更新：根据您的代码...只需将数组作为参数传递

  var temp = document.createElement('div');
  temp.className = 'temp';
  temp.dataset.href = 'zoomout';
  this.actionSorter( [temp] ); // <--- note temp into array

Answer 2

尝试这样的事情

   var temp = document.createElement('div');
    temp.className = 'temp';
    temp.dataset.href = 'zoomout';
    this.actionSorter(temp);