Varify logosu
Giriş
Deneyin
Demo al

  • Popüler anahtar kelimeler

    Kategoriler

    Toplam Sonuçlar

    Kayıt Bulunamadı

    Tüm Sonuçları Görüntüle

    • Kod Yardımcıları

    İçindekiler tablosu

    Kısa ve tatlı

    Kod Yardımcıları, bir web geliştiricisi olarak özellikle tek sayfalı uygulamalar geliştirirken A/B testleri oluşturmanıza yardımcı olur. 

    JavaScript yardımcı işlevleri

    varifyHelpers.waitFor

    Fonksiyon ile waitFor tanımlanmış bir öğeyi beklemek için bir mutasyon gözlemcisi kullanılır. Tanımlanan seçiciye karşılık gelen yeni öğeler DOM'a eklenir eklenmez (örneğin AJAX veya JavaScript aracılığıyla), geri arama işlevi yürütülür.

    Geri arama işlevi, yeni tanımlanan her öğe için çağrılır. 

    Kod örneği

    				
					<div>
  <p>This is existing content.</p>
  <!-- <p class="lazyloaded-content">This content will be loaded later.</p> -->
</div>
				
			
    				
					window.varify.helpers.waitFor('.lazyloaded-content', (element) => {
  // After the content was loaded, we want to color it red.
  element.style.color = 'red';
});

    varifyHelpers.onDomChanged

    Bu işlev, DOM'a her öğe eklendiğinde veya silindiğinde CallBack'i çağırır. Aynı zamanda bir mutasyon gözlemcisine dayanmaktadır. 

    				
					window.varify.helpers.onDomChanged(() => {
  // Write code here, which will run everytime the dom changes.
});

    varifyHelpers.onDomLoaded

    Bu fonksiyon, DOM yüklenir yüklenmez geri çağrıyı çağırır. DOM zaten yüklenmişse, geri arama hemen çağrılır.

    				
					window.varify.helpers.onDomLoaded(() => {
  // Write code here, which will run, when the DOM has loaded.
});

    varifyHelpers.isInView

    Fonksiyon ile isInView  sistem belirli bir DOM öğesinin görüntü alanında tamamen görünür olmasını bekler. Geri arama varsayılan olarak yalnızca bir kez çalıştırılır, ancak isteğe bağlı olarak öğe görüntü alanında her bulunduğunda çalıştırılabilir. 

    				
					// The callback here will be triggered ONE TIME, when the element is in view.
window.varify.helpers.isInView('.product', (element) => {
  window.dataLayer.push({
    event: 'product viewed',
    element,
  });
});

// Adding true as third parameter
// will trigger the callback EVERY TIME the element is in view.
window.varify.helpers.isInView('.product', () => {}, true);

    varifyHelpers.resetListeners

    Bu fonksiyon yukarıda bahsedilen fonksiyonların tüm gözlemcilerini (kesişim ve mutasyon gözlemcisi) sıfırlar. Bu, tanımlanan geri arama fonksiyonlarının artık çalıştırılmayacağı anlamına gelir.

    				
					// As an example, we setup a waitFor listener here. This will use a MutationObserver under the hood.
window.varify.helpers.waitFor('.lazyloaded-content', (element) => {
  element.style.color = 'red';
});

// The next resetting function call could e.g. be located in a navigation callback function.
window.varify.helpers.resetListeners()

  • İlk adımlar

    İzleme ve değerlendirme

    Hedefleme

    Gelişmiş

    Fonksiyona genel bakış