在Javascript中與選擇使用這種「無法讀取的未定義的屬性‘querySelectorAll’」

我試圖用這並找到了一些元素是在DOM在Javascript中與選擇使用這種「無法讀取的未定義的屬性‘querySelectorAll’」

的HTML是這樣

<div class="photovignette"> 
     <h2><span>E</span>xplorascape</h2> 
     <div class="text"> 
      <svg> 
       <defs> 
        <mask id="maskexplora" x="0" y="0" width="100%" height="100%"> 
         <rect class="alpha" x="0" y="0" width="100%" height="100%" /> 
         <text class="title" x="50%" y="10%" dy="1.58em">Explorascape</text> 
        </mask> 
       </defs> 
       <rect class="baseexplora" x="0" y="0" width="100%" height="100%" /> 
      </svg> 
     </div> 
    </div>

進一步下跌

所以我想要做的是，對於一個特定的「.photovignette」我想動畫應用到「阿爾法」裏面是這樣的：如果我用這隻

，它w獸人。但是當我試圖找到「alpha」時，它給了我這個錯誤：「無法讀取屬性'getElementsByClassName'undefined」

如何處理？

來源

2016-07-05 user2646326

'this'是一個DOM元素，它沒有'document'財產。 – undefined

如果你想找到懸停元素的後代元素，您可以使用.querySelector方法：

this.querySelector(".alpha")

在jQuery中：

// `.get(index)` extracts a DOM element from the collection 
$(this).find('.alpha').get(0)

如果targets應該是DOM元素的集合，t母雞可以使用.querySelectorAll方法：

this.querySelectorAll(".alpha")

在jQuery中：

$(this).find('.alpha').get()

來源

2016-07-05 19:20:22 undefined

你可以嘗試這樣的事情： -

$(".photovignette").mouseover(function() { 
     anime({ 
      targets: $(this).find('.alpha'), 
      scale: { 
       value: 0.7, 
       duration: 500, 
       easing: 'easeOutElastic' 
      }, 
      loop: false, 
     });

來源

2016-07-05 19:12:18

問題是我有多個photovignette，並且我想僅將動畫應用於與它一起的alpha。而我正在使用的動畫庫不允許jquery選擇器不幸... – user2646326

你可以分配id給該特定元素或傳遞事件作爲參數並使用它來查找相關的alpha。 event.find（ '阿爾法'）。 –

更新我的小提琴使用這個活動..它工作正常。 –

在Javascript中與選擇使用這種「無法讀取的未定義的屬性‘querySelectorAll’」

回答

相關問題