Question

这似乎应该是超级简单的，但似乎无法弄清楚语法。

基本上我要做的是在悬停时添加一个span作为每个<p>的第一个字符。目前使用JQuery作为我的DOM操作库，所以欢迎使用JQuery解决方案。

所以：

<p>Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.</p>

会变成

<p><span class="comment">comment</span>Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.</p>

请注意，我之前无法添加范围，因为直到它在DOM中才能访问该文本。

Answer 1

在脚本标记上试试

$(document).ready(function () {

    $("p").hover(function () {
        $(this).prepend('<span class="comment">comment</span>');
    }, function () {
        $(this).children(".comment").remove();
    });
});

Answer 2

这是JavaScript，但我相信你可以找到一个说明如何用jQuery做的文档。只需使用insertAdjacentHTML函数即可。您可以在此处阅读其工作原理：https://developer.mozilla.org/en-US/docs/Web/API/Element.insertAdjacentHTML

Answer 3

这是我处理它的方式

var position = 0;
var ele = "<span>comment</span>"
$('p').html($('p').html().substring(0,position) +  ele  + $('p').html().substring (position));

编辑：

感谢A. Wolff这是有效的

$（“comment”）.prependTo（“p”）;

在悬停中添加段落中的span

3 个答案: