Timeline for How to split a DOM node around a selection?
Current License: CC BY-SA 4.0
21 events
| when toggle format | what | by | license | comment | |
|---|---|---|---|---|---|
| Jan 25, 2025 at 16:03 | comment | added | user1636349 | I am maintaining a rich text editor that provides this functionality. Don't know how widely used it is, but mone not to reason why... | |
| Jan 24, 2025 at 15:44 | comment | added | Sergey A Kryukov | @user1636349 — "I still have to find a replacement for execCommand()". Thank you for this note. Yes, frankly, my statement was based on the fact that this function is deprecated, and my own attitude toward such functionality that I consider it weird or redundant. I agree that I should better be more careful. However, do you really consider all that table editing or resizing productive? Maybe, this functionality was deprecated because these operations could be potentially disruptive, and the benefits are marginal. I'm not arguing, just suggest thinking about it. | |
| Jan 24, 2025 at 10:42 | comment | added | user1636349 | AFAICS, you're still dealing with plain text, using node.textContent, not with the DOM tree itself. Whether you agree with my requirements or not is up to you, but they ARE my requirements, and denying them is a bit like saying, "if you want to get to Tipperary, I wouldn't start from here." Basically I need something that behaves like execCommand() does for <b>, <i> etc. but for elements that execCommand() doesn't support, like <bdi>, <cite>, etc (as well as, eventually, replacing execCommand() in these situations).. But don't worry, I solved it myself (see below). | |
| Jan 24, 2025 at 10:32 | comment | added | user1636349 | "You never even need document.execCommand(). This function is deprecated, by the way." I still have to find a replacement for execCommand() commands like enableAbsolutePositionEditor, enableInlineTableEditing, or enableObjectResizing, to name just a few. | |
| Jan 24, 2025 at 3:15 | comment | added | Sergey A Kryukov |
@zer00ne — What do you mean you cannot? I just ran the snipped right on this page, it works. It is not related to contenteditable at all. I already wrote that I don't this that these requirements make any sense. But what do you mean by "breaks"? Anyway, not sure this waste of time worth it. If it was useful for OP, it would...
|
|
| Jan 24, 2025 at 1:50 | comment | added | zer00ne |
Select text then CTRL + Y? I can't get it to work. Did you figure out how to use my code? About those WELL-FORMED chunks the OP wants so badly, it doesn't really matter since under the hood each browser does things differently when it concerns contenteditable. The only thing that really matters is if the formatting and layout is acceptable. So stressing over something that absurd isn't worth it, what the OP wants will break after a couple minutes of use.
|
|
| Jan 22, 2025 at 21:01 | comment | added | Sergey A Kryukov | By the way, formally the HTML chunks I create are well-formed. If this is the reason for not accepting the answer, it is not fair. I just say, that well-formed is not enough. I demonstrated how to protect from an invalid operation: in the last revision, I return from the function if the selection goes across different nodes. The test is: ` if (node != selection.focusNode)`. That answers your question. You did not ask about the most general case, your formulation is reduced to some inline element. | |
| Jan 22, 2025 at 20:58 | comment | added | Sergey A Kryukov | "What happens if the selection is not just plain text, though?" I already answered. I added all you need to understand at the end of the recent revision of my solution. The main thing to understand is this: I already answered your question, and even a lot more, described all aspects. I won't be able to literally work for you more and more, you need to catch up and continue yourself. However, I question the merits of your requirements. At the same time, I'm ready to answer your further questions. | |
| Jan 22, 2025 at 19:20 | comment | added | user1636349 | What happens if the selection is not just plain text, though? See my edited version of the original question where the html is <bdi...<i>...</i>...</bdi> and I want to extract part of the text inside <i>...</i> from the BDI element. You are extracting the text and splitting that, rather than splitting the DOM tree, which is what I require. Notice how my question asks how you split it into WELL-FORMED chunks. | |
| Jan 22, 2025 at 19:12 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
Added last paragraph
|
| Jan 22, 2025 at 17:37 | comment | added | Sergey A Kryukov |
@user1636349 — Okay, please see a more complicated code sample, in the section Added.
|
|
| Jan 22, 2025 at 17:36 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
Second sample
|
| Jan 22, 2025 at 16:59 | comment | added | Sergey A Kryukov |
@user1636349 — I wanted just to give you the idea on one sample, as simple as possible. You have everything to complete the code according to your a bit more complicated requirement. Are you saying that this conversion should happen if the selection is DEF? Could you do it yourself, or do you need a more complicated code sample? This is not hard to do, but it takes more time. Don't you think my demo is all you need to complete it?
|
|
| Jan 22, 2025 at 16:52 | comment | added | user1636349 | thanks, but this is wrapping, not unwrapping: ABCDEFGHI to ABC<bdi>DEF</bdi>GHI or whatever. I'm trying to go from <bdi>ABCDEFGHI</bdi> to <bdi>ABC</bdi>DEF<bdi>GHI</bdi>. | |
| Jan 22, 2025 at 16:23 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
More accurate code sample excuse
|
| Jan 22, 2025 at 16:15 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
Stricter explanation of the simplification: not just one text-only node
|
| Jan 22, 2025 at 15:20 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
Added/clarified simplicity comments in code
|
| Jan 22, 2025 at 14:51 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
Wording: processing
|
| Jan 22, 2025 at 14:44 | history | edited | Sergey A Kryukov | CC BY-SA 4.0 |
Clarification on what else won't work
|
| Jan 22, 2025 at 14:42 | history | edited | isherwood | CC BY-SA 4.0 |
deleted 445 characters in body
|
| Jan 22, 2025 at 14:37 | history | answered | Sergey A Kryukov | CC BY-SA 4.0 |