jQueryを使わずにJavascriptでこれをどのように記述しますか？

Question

は、私が使用している画面の中央にモーダルを配置するには：私は純粋なJavaScriptでこれを行うだろうか知りたい

$('.last-chance').css('margin-top', position - 200 + "px"); 

。

var lastChanceModal = document.querySelectorAll('last-chance'); 
var position = document.documentElement.scrollTop || document.body.scrollTop; 
lastChanceModal.style.marginTop = (position - 200).toString() + "px"; 

Answer 1

あなたが持っている問題は、要素の集まりのような配列であるdocument.querySelectorAll戻りNodeListです。

jQueryはコレクションを処理するために構築されていますが、ネイティブNodeListsには機能が付属していないので、リストを反復処理する必要があります。

私はES6 Array.from関数を使用していますが、Array.prototype.sliceを使用してES5で同じ結果を得ることができます。

また、作業する要素が1つしかない場合は、document.querySelectorを使用して1つの要素を返すことができます。

いずれにしても、クラスセレクタには.が必要です。それはDOMにない場合はjQueryのでは動作しません

var lastChanceModals = document.querySelectorAll('.last-chance'); 
 
// Note-------------------------------------------^ 
 
var position = document.documentElement.scrollTop || document.body.scrollTop; 
 
    
 
Array.from(lastChanceModal).forEach(modal => { 
 
    modal.style.marginTop = (position - 200) + "px"; 
 
})