Javascript:如何将多个p标签中的选定文本划分为每个标签的每个内容 [英] Javascript: How to divide selected text along multiple p tags into each content for each tag

问题描述

我想知道是否可以将沿着多个p标签选择的文本分为每个标签的每个内容.例如，

I wonder that selected text along multiple p tags can be divided into each content for each tag. For example,

<p>I am (selection start)a boy</p>
<p>You are(selection end) a girl</p>

我想像男孩"和你是"那样分开.

I would like to divide like "a boy" and "You are".

还有3个p标签，

<p>I am (selection start)a boy</p>
<p>You are a girl</p>
<p>We are(selection end) friends</p>

我想获得三个元素:男孩"，你是女孩"，我们是".

I would like to obtain three elements, "a boy", "You are a girl", "We are".

Chrome是否可以使用javascript?

Is it possible for Chrome using javascript?

谢谢您的答复.

推荐答案

尝试一下

document.onmouseup=function(){
    var selected = document.getSelection().toString()
    var data=selected.replace(/\r?\n|\r/g, "\n").split("\n").filter(Boolean)
    var dataWithSpan=data.map((x,y)=>`<span>${x}</span>`);
    console.log(data)
    console.log(dataWithSpan)
}

select from the following paragraps
<p>I am a boy</p>
<p>You are a girl</p>

select from the following paragraps
<p>I am a boy</p>
<p>You are a girl</p>
<p>We are friends</p>

这篇关于Javascript:如何将多个p标签中的选定文本划分为每个标签的每个内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！