jQuery 换行文本而不带容器

jQuery wrap text without container

本文关键字：换行 文本 jQuery      更新时间：2023-09-26

我有这个html

<div>This text is <strong>really</strong> awesome!</div>

我想换行<span>点击的部分文本。因此，如果您单击此文本是部分，您应该得到

<div><span>This text is </span><strong>really</strong> awesome!</div>

与div的任何原子部分相同

我正在尝试制作$('div').click();事件，但是如果单击的部分没有包裹在某物中，我找不到如何仅检测单击的部分（<strong>really</strong>部分可以，但之前和之后的部分都不能）

您可能想查看.contents()方法。这将为您提供文本节点以及包装的节点，因此您可以包装它们。要调整 jQuery 文档中的示例：

$(".container")
    .contents()
    .filter(function() {
        // get only the text nodes
        return this.nodeType === 3;
    })
    .wrap( "<span></span>" );

听起来您想在单击后包装内容，我认为这可能非常困难。如果可能，最好在用户单击之前包装内容，然后将样式应用于他们单击span - 这要简单得多。如果您使用上面的代码进行包装，则可以应用类似

$(".container").on('click', 'span', function() {
    $(this).addClass('clicked');
});
相关文章：