Question

有没有办法使用jquery（或javascript）获取html：

<div class="elem2 elem"><span>text2.1</span><span>text2.2</span></div>

来自这个html：

<div class="container">
  <div class="elem1 elem">
    <span>text1.1</span>
    <span>text1.2</span>
  </div>
  <div class="elem2 elem">
    <span>text2.1</span>
    <span>text2.2</span>
  </div>
</div>

我尝试了几种方法：

alert($('div.container').children().eq(1).html());
alert($('div.container > :nth-child(2)')).html());
alert($($('div.container').children()[1]).html());
alert($('div.elem2').html());

但它总是给我相同的结果：

<span>text2.1</span> <span>text2.2</span>

没有warper div。

我已经将代码示例放在： http://jsfiddle.net/kZBUr/

plz help !!

Answer 1

您正在寻找原生outerHTML属性，但并非所有浏览器都支持此属性。这是一个跨浏览器的解决方案。

示例： http://jsfiddle.net/patrick_dw/kZBUr/3/

var selected = $('div.container > .elem2.elem');

selected = selected[0].outerHTML || $('<div>').append(selected.clone()).html();

$('#result').text(selected);

Answer 2

你已经选择了第二个孩子。包装文本（和）不是元素html的一部分。例如： $（'div.container＆gt;：nth-child（2）'）。attr（'class'）将返回elem2 elem

Answer 3

我认为.eq（1）函数是从零开始的索引。

请改为尝试：

alert($('div.container').children().eq(0).html());
alert($('div.container > :nth-child(1)')).html());
alert($($('div.container').children()[0]).html());
alert($('div.elem2').html());

如何选择第二个子元素（div）而不只是其内容？

3 个答案: