如何从html响应中提取一些特定内容

时间:2014-06-17 14:35:03

标签: jquery

我为按钮写了一个监听器,如下所示

$(document).on("click", ".btnclick", function() {

var htmlString = $("div#"+id_attr_val+".Topping-details").eq(0).html(); 

console.log(htmlString);

});

以上htmlString的结果是

<h6 class="tdHeading">Regular, 50 Ml 1</h6>
<i id="topping-close"></i><img src="images/arrow-topping.png">
<section class="secclass"><a href="#">Honey with Chocolate Sauce  10 ML</a></section>
<section class="secclass"><a href="#">Honey with Carmel  10 ML</a></section>

<h6 class="tdHeading">Regular, 50 Ml 2</h6>
<i id="topping-close"></i><img src="images/arrow-topping.png">
<section class="secclass"><a href="#">Honey with Chocolate Sauce  10 ML</a></section>
<section class="secclass"><a href="#">Honey with Carmel  10 ML</a></section>

<h6 class="tdHeading">Regular, 50 Ml 3</h6>
<i id="topping-close"></i><img src="images/arrow-topping.png">
<section class="secclass"><a href="#">Honey with Chocolate Sauce  10 ML</a></section>
<section class="secclass"><a href="#">Honey with Carmel  10 ML</a></section>

现在我得到了上面提到的三行数据

我的要求是,点击一个按钮,我需要再添加一行(增加h6下的数字) 所以它看起来像这样,并将其附加到现有的htmlString

<h6 class="tdHeading">Regular, 50 Ml 4</h6>
<i id="topping-close"></i><img src="images/arrow-topping.png">
<section class="secclass"><a href="#">Honey with Chocolate Sauce  10 ML</a></section>
<section class="secclass"><a href="#">Honey with Carmel  10 ML</a></section>

我能够以这种方式获取最后一个h6的计数,但无法继续如何将这个新内容添加回现有的htmlString

var n = $("div#"+id_attr_val+".Topping-details h6").length ;

<h6 class="tdHeading">Regular, 50 Ml 4</h6>
<i id="topping-close"></i><img src="images/arrow-topping.png">
<section class="secclass"><a href="#">Honey with Chocolate Sauce  10 ML</a></section>
<section class="secclass"><a href="#">Honey with Carmel  10 ML</a></section>

有人可以帮忙吗?

1 个答案:

答案 0 :(得分:1)

Div append应该这样做。

var n = $("div#"+id_attr_val+".Topping-details h6").length ;
var text1 = $('.secclass a')[0].text;
var text2 = $('.secclass a')[1].text;
$("div#"+id_attr_val+".Topping-details h6").parent().append('<h6 class="tdHeading">Regular, 50 Ml '+n+'</h6>    <i id="topping-close"></i><img src="images/arrow-topping.png">    <section class="secclass"><a href="#">+text1 +</a></section>    <section class="secclass"><a href="#">+text2 +</a></section>')