我如何获得文本所属的span类ID？ [英] How will i get the span class id under which the text belongs?

问题描述

HTML （contenteditable div）

HTML (contenteditable div)

<div id="board">
   <div>int main<span class="openParen bm1">(</span><span class="closeParen bm1">)</span>{</div>
   <div>if<span class="openParen bm2">(</span> <span class="openParen bm3">(</span>x>1<span class="closeParen bm3">)</span> && <span class="openParen bm4">(</span>x<10<span class="closeParen bm4">)</span> <span class="closeParen bm2">)</span></div>
   <div>statement;</div>
   <div>}</div>
</div>

我在行中使用xloop，在每行中使用yloop。

I am using an xloop for the rows, and yloop for the characters inside each row.

1。）我如何获得第二个的 span class （ （xloop：1 yloop：7）w / c是 bm2 ？

1.) How would i able to get the span class of the 2nd ( (xloop:1 yloop:7) w/c is bm2?

2 。）我如何获得 span s BETWEEN bm2 ，我将在每个循环中存储并存储文本数组内的跨度

2.) How would i get the spans BETWEEN bm2, i will loop in each of them and store the text of the span inside an array

JS

for( var x=0; x<$('#board > div ').size(); x++ ){
    var inlineDiv_num_text = $('#board > div ').eq(x).text();
    for( var y=0; y<$('#board > div ').eq(x).text().length; y++){

         kword_search = kword_search + inlineDiv_num_text.charAt(y);
         // i will detect the target paren here
          if(/(if|while|for)\s*\($/.test(kword_search)){
            //know w/c span the ( belongs to
            //get the bm span inside of it
         }
    }
}

目标：将 bm 分组存储在数组中

GOAL: Store the bm groupings inside an array

 array[0] = ( (x>1) && (x<10) )
 array[1] = (x>1)
 array[2] = (x<10)

推荐答案

我相信这会回答你的第一个和第二个问题。

I believe this answers your first and second questions.

它为你提供了bm2类的openParen和closeParen内的跨度，并将文本存储在一个数组。（这只捕获括号，因为只有括号在跨距内。）

It gives you the spans inside the "openParen" and "closeParen" of the "bm2" class, and stores the text inside an array. (This only captures the brackets, because only the brackets are inside the spans.)

var open = $('span[class="openParen bm2"]')
var spans = open.nextUntil('span[class="closeParen bm2"]')
var inside = []
$.each(spans, function(i, span){
    inside.push($(span).html())
})
alert(inside.join('-'))

此处示例： jsFiddle

编辑

不确定你是怎么做的在span标签之间做，我首先获取父div元素的html，然后使用正则表达式传递跨度：

Not sure how you'll do "between the span tags", I'd start by getting the html of the parent div element, and passing the spans using regex:

var allcontent = $('span[class="openParen bm2"]').parent().html()
var betweenSpan = allcontent.split(/<span class="openParen bm2">[^<]*<\/span>|<span class="closeParen bm2">[^<]*<\/span>/)[1]
var valuesArray = betweenSpan.split(/<[^>]*>/)

给予你是js数组：

[" ", "(", "x>1", ")", " && ", "(", "x<10", ")", " "]

示例： jsFiddle

绝对不漂亮。

更好的解决方案是重新考虑你的html标签的结构（即把你想要捕获的值放在一些标签内！）

A better solution would be to reconsider the structure of your html tags (i.e. put the values you want to capture inside some tags!)

无论如何，这已经足够了，我会留给你。

Anyway, that's enough, I'll leave it up to you.

这篇关于我如何获得文本所属的span类ID？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！