DEV Community

Lam
Lam

Posted on

Dom Selection Cheat Sheet

#dom #cheatsheet

[Reference] Events 

document.addEventListener('selectionchange', () => {})
Enter fullscreen mode Exit fullscreen mode

[Reference] Deleting 

sel.deleteFromDocument()
Enter fullscreen mode Exit fullscreen mode

[Reference] Collapsing 

sel.collapse(parent, offset)
sel.collapseToEnd()
sel.collapseToStart()
sel.isCollapsed
Enter fullscreen mode Exit fullscreen mode 
sel.containsNode(node)
Enter fullscreen mode Exit fullscreen mode

[Reference] Methods 

sel.removeAllRanges() //  deselects
sel.addRange(range) //    sets a selection
sel.removeRange(range) // remove a range
Enter fullscreen mode Exit fullscreen mode 
sel.rangeCount
sel.getRangeAt(0) // get the 0th range
Enter fullscreen mode Exit fullscreen mode

[Reference] Selection 

var sel = document.getSelection()
Enter fullscreen mode Exit fullscreen mode

See: https://devdocs.io/dom/selection

Reference

{: .-three-column}

Reference

Top comments (0)

Read next

blazestorm profile image

Take Control of VSCode Tabs with Tabby: The Ultimate Tab Manager!

Namit Arora -

thomasbnt profile image

What's your favorite book on web development? 📖

Thomas Bnt -

crqcastro profile image

ROLLUP

Cesar Castro -

pratikbarjatya profile image

🌐 The Future of Language Processing with Retrieval-Augmented Generation (RAG) 🌐

Pratik Barjatiya -