使用jquery删除两个span之间的内容

时间:2015-09-22 06:22:12

标签: javascript jquery html css

这是我的HTML代码

<div class="breadcrumbs">
    <span typeof="v:Breadcrumb">
    <a title="Go to Innomations." href="" class="home">Home</a></span>
    >>
    <span typeof="v:Breadcrumb" class="turnoffmain">
    <a rel="v:url" property="v:title" title="Go to Products." href="">Products</a></span> 
</div>

我想删除两个范围之间的内容>>

我该怎么做?

我试过这个

$("a").each(function(){
   if($(this).attr("title") == "Go to Products."){
      $(this).closest('span').addClass('turnoffmain');
    } 

即,向href迭代并识别"Go to Products."并添加了一个隐藏第二个跨度的类turnoffmain

但是如何删除这两个跨度之间的>>

2 个答案:

答案 0 :(得分:2)

您可以在HttpMethodNamecontents()

的帮助下执行此类操作

each()
$('.breadcrumbs').contents().each(function() {
  if (this.nodeType == 3)
    this.remove();
});
或者<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="breadcrumbs"> <span typeof="v:Breadcrumb"> <a title="Go to Innomations." href="" class="home">Home</a></span> >> <span typeof="v:Breadcrumb" class="turnoffmain"> <a rel="v:url" property="v:title" title="Go to Products." href="">Products</a></span> </div>代码

之间更具体的删除元素

span
$('.breadcrumbs').contents().each(function() {
  console.log(this.nextSibling.nodeName == 'SPAN');

  if (this.nodeType == 3 && this.nextSibling && this.prevSibling && this.nextSibling.nodeName == 'SPAN' && this.prevSibling.nodeName == 'SPAN')
    this.remove();
});

或者正如您所说的,如果内容位于课程<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="breadcrumbs"> <span typeof="v:Breadcrumb"> <a title="Go to Innomations." href="" class="home">Home</a></span> >> <span typeof="v:Breadcrumb" class="turnoffmain"> <a rel="v:url" property="v:title" title="Go to Products." href="">Products</a></span> </div>

之上,则删除内容

turnoffmain
$('.breadcrumbs').contents().each(function() {
  console.log(this.nextSibling.nodeName == 'SPAN');

  if (this.nodeType == 3 && $(this.nextSibling).is('.turnoffmain'))
    this.remove();
});

答案 1 :(得分:-1)

var a = '<div class="breadcrumbs"><span typeof="v:Breadcrumb">    <a title="Go to Innomations." href="" class="home">Home</a></span> >> <span typeof="v:Breadcrumb" class="turnoffmain"><a rel="v:url" property="v:title" title="Go to Products."href="">Products</a></span> </div>';

var str = a;
str = str.replace(">>", "");
alert(a)

基本示例;