![](/img/trans.png)
[英]Append content inside UL with list item and anchor tag <li><a></a></li>
[英]Fetch html content of child tag inside li
我有一个类似的清单:
<ol id="id1">
<li><strong>aaa</strong><em>bbb<br />ccc</em></li>
<li><strong>111</strong><em>222<br />333</em></li>
</ol>
如何获取每个<li>
中<em>
标签的html内容?
我尝试使用jQuery的.html()
方法,但是在我尝试制作的android html5应用程序中行为不一致。 上面的Android 5.1能够很好地阅读,但是android 4.4.2设备不会显示任何内容。
请问有另外一种获取html的方法吗?
谢谢!
$('li').each(function(){
alert($(this).find('em').html());
});
要么
$('li em').each(function(){
alert($(this).html());
});
使用innerHTML:
var items = document.getElementsByTagName("li");
for(var i=0;i<items.length;i++){
alert(items[i].getElementsByTagName("em")[0].innerHTML);
}
var liElements = document.getElementById("id1").getElementsByTagName("li");
for(var i=0;i<liElements.length;i++){
alert(liElements[i].getElementsByTagName("em")[0].innerHTML);
}
您可以像这样获取所有em元素,然后对其进行迭代。
$(function(){
$("ol li > em").each(function(index, element){
var em = $(element).html();
alert(em);
});
});
$(function(){ $("ol li > em").each(function(index, element){ var em = $(element).html(); alert(em); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <ol id="id1"> <li><strong>aaa</strong><em>bbb<br />ccc</em></li> <li><strong>111</strong><em>222<br />333</em></li> </ol>
此代码将为您提供所需的内容:
var insideEM = $("li").children("em").html();
答案将是: 222<br />333
我当然认为这是最普通的js方法:
var $list = document.querySelectorAll("#id1 li em"); document.write("<br />"); for (i = 0; i < $list.length; i++) { document.write((i+1) + " match: <br />"); document.write($list[i].innerHTML); document.write("<br />"); }
<ol id="id1"> <li><strong>aaa</strong><em>bbb<br />ccc</em></li> <li><strong>111</strong><em>222<br />333</em></li> </ol>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.