javascript - 如何获取光标下的文字？

Question

我正在尝试使用 jquery 制作用户脚本。我希望它从光标下的元素获取光标下的文本。问题是我编写的脚本使用 jQuery 的 .text() ，如果元素有子元素，它会返回连接的子元素。知道如何获取我正在单击的容器的仅文本吗？

(我在 ebay.com 上尝试过，因为该网站很复杂)

// ==UserScript==
// @name           Selector
// @namespace      http://userstyles.org
// @description    none
// @include        http://*.*
// @require        http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
// ==/UserScript==

var $;

// Add jQuery
(function(){
    if (typeof unsafeWindow.jQuery == 'undefined') {
        var GM_Head = document.getElementsByTagName('head')[0] || document.documentElement,
            GM_JQ = document.createElement('script');

        GM_JQ.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';
        GM_JQ.type = 'text/javascript';
        GM_JQ.async = true;

        GM_Head.insertBefore(GM_JQ, GM_Head.firstChild);
    }
    GM_wait();
})();

// Check if jQuery's loaded
function GM_wait() {
    if (typeof unsafeWindow.jQuery == 'undefined') {
        window.setTimeout(GM_wait, 100);
    } else {
        $ = unsafeWindow.jQuery.noConflict(true);
        letsJQuery();
    }
}

function letsJQuery() {
    //alert("Loaded jQuery" + $().jquery); // check jQuery version

    $("*:not(html, head, body)").hover( function () {
             $(this).css("border", "1px dotted blue");
    }, 

    function () {                
            $(this).css("border", "none");
    }).click( function () {
           var s = $(this).text();
           if (s) alert(s);
           return false;
    });
}

Answer 1

您可以将点击事件处理程序绑定(bind)到文档并检查事件目标:

$(document).bind('click', function(e) {
    console.log('text: ', e.target.value || e.target.textContent || e.target.text);
});

更新

$(document).bind('click', function(e) {
    $(e.target).contents().each(function(index, elem) {
        if( elem.nodeType === 3 && $.trim(elem.nodeValue).length ) {
            console.log($.trim(elem.nodeValue));
            return false;
        }
    });
});