2014-09-10 68 views
0

我想要一种方法来获取第一个数值存在于一个表(和各自的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。任何帮助?

+0

用空格拆分table的'textContet',迭代结果数组,直到找到数字。 – Teemu 2014-09-10 17:39:09

回答

0

你可以做普通的老办法:让一个递归函数将返回具有文本内容的第一个节点的文本:

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(打开控制台)

+1

要检查它是否是数字而不是字符串,请使用!isNaN(content)。如果这返回false然后继续迭代。 – RichieAHB 2014-09-10 17:52:37

0

如何接受正则表达式一个奇特的查找功能。

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

相关问题