Web DOM

1189 ワード

frontend テキストリンク

_

DOM要素の場所の取得

getBoundingClientRect()

要求された値のエンティティが見つからない場合は、画面の外にあり、もちろん負の値が表示されます.このときはgetBoodingClientRect()を使用します.
ただし、getBoundgClientRect()を使用すると、リフロー現象が発生する可能性があります.
再フロー(Reflow):ブラウザがWebページの一部または全部を再描画する必要がある場合、再フローが発生します.

IntersectionObserver()

リフレッシュを回避し、
DOM APIは効果を表示するために使用できます

const io = new IntersectionObserver(callback[, options])

callback

callback:ターゲットセグメントが交差するときに実行する関数

エントリのリスト:IntersectionObserverEntryオブジェクト.配列として返されるため、foreachを使用して処理するか、単一のターゲットで配列である点を考慮してコードを記述する必要があります.

observer:コールバック関数を呼び出すセグメントObserver

options

root

default:null、ブラウザのviewport
交差領域の基準となるルートエンティティ.observeオブジェクトとして登録するエイリアスは、ルートのサブエイリアス

である必要があります.
注意:http://blog.hyeyoonjung.com/2019/01/09/intersectionobserver-tutorial/

スクロールについて

// 화면의 Y축의 상단값 
window.pageYOffset 
// 화면의 Y축의 하단값 
window.pageYOffset + window.innerHeight

Reference

この問題について(Web DOM), 我々は、より多くの情報をここで見つけました https://velog.io/@vmelove/Web-DOM

テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。

Collection and Share based on the CC Protocol

第1週後期^^7

palindromeを検証する方法