Question

我正试图找到一个表（和相应的tbody）中存在的第一个数字值，但它需要能够找到第一个数字的值，并忽略它所有的标记，直到它达到数值。

<table id="TableID">
    <thead></thead>
    <tbody>
        <tr></tr>
        <tr>
            <td></td>
            <td>
                <div>
                    <div>
                        <span>
                            4031007
                        </span>
                    </div>
                    <div>
                        <span>
                            whatever
                        </span>
                    </div>
                </div>
            </td>
            <td></td>
        </tr>
    </tbody>
</table>

在上面的示例中，我们会尝试查找4031007，它位于<span>内，但它可能是<div>或其他内容。我不需要使用JQuery就需要它。有什么帮助吗？

Answer 1

你可以用普通的方法做：创建一个递归函数，它将返回第一个有文本内容的节点的文本：

function findFirstNumber(node) {
    // If this is a text node, return its contents. Trim it because there is
    // whitespace between the elements that should be ignored
    if (node.nodeType == Node.TEXT_NODE)
        return node.textContent.trim();

    // Iterate over all child nodes and finde the first one that has text in it
    for (var child = node.firstChild; child; child = child.nextSibling) {
        var content = firstText(child);
        if (content && isNumber(content))
            return content;
    }

    // No text found
    return '';
}

function isNumber(value) {
    return !!isNaN(value);
}

console.log(findFirstNumber(document.getElementById('TableID')));

我使用mdn page about Node来了解如何执行此操作。

see fiddle（打开你的控制台）

Answer 2

如何使用接受正则表达式的花哨的find函数。

function findRegExp(start, reg, mod) {
    if (! (reg && start)) return this;

    return [].slice.call(start.querySelectorAll('*')).filter(function(elem) {
        if (typeof reg == 'string') 
            reg = new RegExp(reg, mod ? mod : '');

        var clone = elem.cloneNode(true),
            child = clone.children;

        for (var i=child.length; i--;) 
            clone.removeChild(child[i]);

        var txt = clone.textContent.trim();

        return reg.test(txt);
    });
}

像

一样使用

var elems = findRegExp(document.getElementById('TableID'), /^\d+$/);

FIDDLE

和jQuery版本

$.fn.findRegExp = function(reg, mod) {
    if (!reg) return this;
    return this.find('*').addBack().filter(function() {
        if (typeof reg == 'string') 
            reg = new RegExp(reg, mod ? mod : '');
        var c = $(this).clone();
        c.children().remove();
        var txt = $.trim(c.text());

        return reg.test(txt);
    });
}

然后您可以搜索仅包含数字的元素

$('#TableID').findRegExp(/^\d+$/);

FIDDLE

从表中的后代获取第一个数字值

2 个答案: