使用Jquery将范围添加到数字

Question

因此，本周我一直在讨论jQuery。试图将一些很酷的东西添加到我目前正在研究的WordPress主题中。

随着这个美好的网站的帮助下，我收到了以下的JS包围在某个div的数字跨度。一切都很好，直到我开始实施更多的JS来发现这实际上是导致我的其他JS中断。

//add span to numbers 
var elem = document.getElementById('passage'); 
elem.innerHTML = elem.innerHTML.replace(/\b(\d+)\b/g, '<span>$1</span>'); 

然而，由于我使用jQuery，采取“的document.getElementById”出来，这样结束了，我被告知：

//add span to numbers 
var elem = $('passage'); 
elem.innerHTML = elem.innerHTML.replace(/\b(\d+)\b/g, '<span>$1</span>'); 

我想这将解决没有运气的情况。任何想法，为什么这不工作？由于

我的最终结果是要能够样式编号喜欢这个网站确实为他们的经文：http://marshill.com/media/the-seven/lukewarm-in-laodicea-comfort-and-convenience-before-christ#scripture

Answer 1

如果你在id选择您需要的CSS-都id选择：

var elem = $('#passage');, 

要通过一流的选择：

var elems = $('.className'); 

使用$('#passage')选择，你结束了一个jQu ERY对象，而不是一个DOM节点，所以$('#passage').innerHTML（或elem.innerHTML）返回一个错误：在Chromium 19

Uncaught TypeError: Cannot call method 'replace' of undefined要解决的是，你可以“降”回DOM节点有：

elem.innerHTML = $('#passage')[0].innerHTML.replace(/*...*/); 

或改为使用jQuery：

elem.html(function(i,oldHTML){ 
    return oldHTML.replace(/\b(\d+)\b/g, '<span>$1</span>'); 
});​ 

JS Fiddle demo。

参考文献：

• jQuery selectors。
• html()。

Answer 2

对于第一行，当使用ids时，您希望用磅符号前置该字符串;即$('#passage')。

对于第二行，请注意，做$('#passage')会返回一个jQuery对象，所以您不能在其上使用标准方法。你应该使用jQuery方法。 innerHTML的等价物是.html()。

所以，你想做到以下几点：

//add span to numbers 
var elem = $('#passage'); 
elem.html(elem.html().replace(/\b(\d+)\b/g, '<span>$1</span>')); 

有点难看，但它能够完成任务。 David's answer略显雄辩。