如何在 Javascript/Jquery 中获取包含点击文本的元素？答案

【问题标题】：How do I get the element containing clicked text in Javascript/Jquery?如何在 Javascript/Jquery 中获取包含点击文本的元素？
【发布时间】：2013-02-25 21:09:16
【问题描述】：

我想在单击文本时替换页面上的文本，甚至只是替换单击的单个单词。我尝试了一种自上而下的方法，选择 DOM 中的所有元素，过滤掉 textNodes，用标签包装每个元素，并向每个标签添加一个单击事件处理程序。但这太慢且效率低下，尤其是在非常大且动态的网站上。

我只需要替换被点击的文本。从event.target 开始是否有自下而上的方法？例如，如何找到最接近 event.target 的 textNode？p>

【问题讨论】：

标签： javascript jquery events jquery-events textnode

【解决方案1】：

在您给出的示例中，您可以执行以下操作；欲了解更多信息，请参阅 How do I select text nodes with jQuery?

$(document).click(function(event) {     
    textNodes = $(event.target).contents().filter(function() {
        return this.nodeType == 3;
    });

    textNodes.each( function() {
         $(this).replaceWith("New Text");
    });
})

【讨论】：

您的操作方式有些复杂，但它的工作方式如下：jsfiddle.net/qqm9a/3
我把我的问题改成根本不使用divs，代码在JSFiddle中，试试看。它适用于您的跨度、div 等。

【解决方案2】：

你试过Jquery's .closest()吗？

说明：对于集合中的每个元素，通过测试元素本身并向上遍历其在 DOM 树中的祖先来获取与选择器匹配的第一个元素。

【讨论】：