当标签内有嵌套的子标签的情况下,如何用jquery检索纯文本内容


如以下代码所示,id为tidy的<a>标签中既存在<span>标签,又存在“This is some text”的文本。那么问题来了,怎么用jquery只取“This is some text”的文本,而不取<span>里的内容?

<a id="tidy">
    <span id="Span1">First span text</span>
This is some text <span id="Span2">Second span text</span></a>

方法一:使用.html()取到a标签中的所有内容后,用正则表达式筛选出不被有"<"、">标签包围的内容,并去掉换行符。

$("#tidy").html().replace(/<.*>*<.*>|\s/g,"");

评价:初步达到目标,解决问题的工具更多还是正则表达式,并且由于正则表达式的制约,该方法适用性较窄。


方法二:复制整个<a>,然后去掉a标签的子标签,再用.text()获得所需文本。

<span style="font-size:14px;">$("#tidy")
.clone()//复制a标签
.children()//找到所有子标签
.remove()//删除所有子标签
.end()//退回上一匹配元素
.text();//取到所需文本</span>

评价:达到目标,但是对原表签的操作是只读的,不能对原标签中的文本进行修改。


方法三:复制整个<a>,然后去掉a标签的子标签,再用.text()获得所需文本。

$("#tidy").contents().filter(function(){ 
  return this.nodeType == 3; 
})[0].nodeValue = "The text you want to replace with" 


评价:达到目标,能对原标签中的文本进行读写操作,但是nodeValue是js的属性。



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值