window.getSelection() deleteFromDocument for list item

Question

My html code is

 <ul>
    <li>list1</li>
    <li>list2</li>
    <li>list3</li>
    <li>list4</li>
    <li>list5</li>
  </ul>

when i select the first three list items and using the following code to delete the selected list items

 sel = window.getSelection();
    if(!sel.isCollapsed){
        sel.deleteFromDocument();
    }

its looks like the following

how to delete the selected lists with bulletins,

Nikhilesh Shivarathri · Answer 1 · 2016-09-13T12:18:57.223

1

As I can see , you're using plain Javascript, so instead of applying the sel.deleteFromDocument(); use sel.focusNode.parentNode.remove().

NOTE: This is suggested if you're intending the deletion for the list items only.

Check the below example.

document.onmouseup = onSelect;
document.onkeyup = onSelect;

function onSelect() {
  sel = window.getSelection();
  if (!sel.isCollapsed) {
    sel.focusNode.parentNode.remove();
  }
}

<ul>
  <li>list1</li>
  <li>list2</li>
  <li>list3</li>
  <li>list4</li>
  <li>list5</li>
</ul>

edited Sep 13 '16 at 12:18

answered Sep 13 '16 at 11:30

Nikhilesh Shivarathri

1,640
10
16

Please select from top to bottom and then click the canvas around it, its pretty buggy. – Randy Sep 13 '16 at 11:33
Please re-check the example @Randy :) – Nikhilesh Shivarathri Sep 13 '16 at 11:57
I've reverted back to the earlier edit because it is getting more complicated. I think there's no other way to get this done by plain javascript. – Nikhilesh Shivarathri Sep 13 '16 at 12:18
`sel.focusNode.parentNode.remove()`did the job for me. I wanted to remove not only the node text but also the node itself. – Hermann Schwarz Nov 12 '21 at 13:43

score 0 · Answer 2 · answered Sep 13 '16 at 11:25

You can check for empty list elements:

$('ul li').filter(function() {return $(this).text() == '';}).remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="myList">
  
  <li></li>
  <li>a</li>
  
</ul>

window.getSelection() deleteFromDocument for list item

2 Answers2