我是jquery的新手,并且在我的工作中分配了一些工作来完成jquery。我有HTML DOM如下
<bl id="delme">
<bt class="abst">Test1:</bt>
<bb>Test1Value</bb>
<bt class="abst">Test2</bt>
<bb>Test2Value</bb>
<bt class="abst">Test3</bt>
<bb>Test3Value</bb>?
<bt class="abst">Test4</bt>
<bb>Test4Value</bb>
<bt class="abst">Test5</bt>
<bb>Test5Value</bb>?
<bt class="abst">Test6</bt>
<bb>Test6Value</bb>
<bt class="abst">Test7</bt>
<bb>Test7Value</bb>
<bt class="abst">Test8</bt>
<bb>Test8Value</bb>?
<bt class="abst">Test9</bt>
<bb>Test9Value</bb>
<bt class="abst">Test10</bt>
<bb>Test10Value</bb>
</bl>
现在我需要使用jquery来获取像
这样的值Test1:Test1Value
Test2:Test2Value .....
Test10:Test10Value
我该怎么做?
我无法通过类查询,因为所有类都具有相同的名称。还有其他选择吗?
答案 0 :(得分:2)
我认为,首先想一想,虽然这是未经测试的,但以下情况应该有效:
var values = {};
$('bt.abst').each(
function(){
values[$(this).text()] = $(this).next('bb').text();
});
JS Fiddle demo,虽然该演示使用了真实标记(dl
,dt
和dd
元素。
答案 1 :(得分:1)
您可以使用以下jQuery创建一个字符串数组,其格式与您相同。
var valueArray = $('#delme bt').map(function() {
return $(this).text().replace(/^(.*):$/, '$1') + ': ' + $(this).next('bb').text();
});
现在您可以根据需要操作该字符串数组,例如使用.join()
创建单个字符串。
编辑:.map()
函数内的主线说明:
即。 $(this).text().replace(/^(.*):$/, '$1') + ': ' + $(this).next('bb').text();
此行以所需格式构造连接字符串。让我们分解两个棘手的组件(忽略': '
):
$(this).text().replace(/^(.*):$/, '$1')
:这会在映射循环中获取当前<bt>
元素($(this).text()
)的文本内容,然后使用正则表达式去除任何:
at结束。我这样做是因为在你的示例HTML中,第一个项目的文本为&#34; Test1:&#34;,而其他项目的末尾没有冒号。通过这种方式剥离,我确保了一致的输出(否则,第一个字符串将是&#34; Test1 :: Test1Value&#34;)。$(this).next('bb').text()
:这只是获取DOM中当前<bt>
之后的下一个元素的文本<bb>
元素。如果这更有意义,请告诉我。 : - )
答案 2 :(得分:1)
你可以这样做:
var results = {};
$("#delme bt").each() {
var self = $(this);
results[self.text()] = self.next().text();
}
// results object contains bt text as keys, bb text as values
// results["Test1:"] == "Test1Value"
这将获取#delme对象中的每个bt,然后从中提取文本,然后获取下一个DOM对象(将是相应的bb对象),然后从中获取文本并将两者分配回结果对象。
如果你想在一个数组中使用交替的bt和bb值而不是一个对象的结果,可以这样做:
var results = [];
$("#delme bt").each() {
var self = $(this);
results.push(self.text())
results.push(self.next().text());
}
// results array contains alternating bt and bb values
// results[0] == "Test1:"
// results[1] == "Test1Value"
答案 3 :(得分:0)
我不确定这是否是正确的方法,但......
我倾向于在我的div中使用多个类。那就是我创建一个类来对元素进行分组,然后创建另一个类来标识一个单数元素。你也可以简单地给它一个id。
您可以创建多少个课程没有限制。我使用整个地方的类作为标识符。还有其他方法吗?我很确定,但这种方式很好。
实际上,我可能写的有点不同。
<div class="abst test1">
<div class="abstTitle">Test1:</div>
<div class="abstValue">Test1Value</div>
</div>
var test1Title = $('.test1 > .abstTitle').html();
var test1Value = $('.test1 > .abstVal').html();
... idunno