如何使用Jquery/Javascript从嵌套HTML标记中获取价值 [英] How to get value from nested HTML tag with Jquery/Javascript
问题描述
我在我的网站上使用外部银行贷款计算器,该计算器在输入特定金额后会自动计算贷款条件.
I'm using an external bank-loan-calculator on my website, which after entering specific amounts of money it automatically calculates the conditions for a loan.
现在,出于显示原因,我需要从生成的值中提取一些数据.我想我可以用Jquery做到这一点,但我不确定为什么.
Now, for display reasons I need to extract some data from the generated values. I think I could do that with Jquery but I'm not sure why.
这是计算器插件生成的HTMl:
Here is the HTMl the calculator plugin generates:
<section class="info">
<div class="graph on">
<div class="sums">
<dl data-type="capital">
<dt>
<span class="percent">2%</span>
</dt>
<dd>100.000</dd>
</dl>
<dl data-type="bankloan">
<dt>
<span class="percent">18%</span>
</dt>
<dd>400.000</dd>
</dl>
<dl data-type="mortage">
<dt>
<span class="percent">80%</span>
</dt>
<dd>1.500.000</dd>
</dl>
</div>
</div>
</section>
我需要的是<dd>
-标记
有人建议如何实现吗?
推荐答案
是的,您可以使用jquery函数each()
进行操作,该函数将解析每个<dl>
元素,然后在其中的每个元素中找到<dd>
元素并获取相关文本,如下所示:
Yes you can do it using jquery function each()
that will parse every <dl>
element, and after that find the <dd>
element inside each of them and get the related text, like following :
$('.sums').find('dl').each(function(){
$('#sums_area').append('<h2>' + $(this).find('dd').text() + '</h2>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<section class="info">
<div class="graph on">
<div class="sums">
<dl data-type="capital">
<dt>
<span class="percent">2%</span>
</dt>
<dd>100.000</dd>
</dl>
<dl data-type="bankloan">
<dt>
<span class="percent">18%</span>
</dt>
<dd>400.000</dd>
</dl>
<dl data-type="mortage">
<dt>
<span class="percent">80%</span>
</dt>
<dd>1.500.000</dd>
</dl>
</div>
</div>
</section>
<div id='sums_area'></div>
希望这会有所帮助.
这篇关于如何使用Jquery/Javascript从嵌套HTML标记中获取价值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!