Javascript JQuery选择div文本

这是我的html代码。单击链接时，我必须选择

active

（而不是链接），并将

active

转换为

|

这是我的名片

如何选择“活动”文本而不是链接？我试过使用

$（'.archivedelite'）.text（）

，但它包含

活动的|存档的|删除的

我正在尝试的是，我必须将单击的链接转换为文本，将其他文本转换为链接。 提前感谢

试试下面的脚本-

var $element = $('.archiveDelete');
$element.clone().children().remove().end().text();

试试下面的脚本-

var $element = $('.archiveDelete');
$element.clone().children().remove().end().text();

只需执行

$（this）.text（）

，它就会显示您单击的链接

编辑代码：

  $('.archiveDelete a').click(function(){
    //alert($(this).text());
    var all=$(this).text();
    alert(all);
  });

要获取链接的链接，请执行以下操作：

要显示

活动

请参阅此小提琴：

只需执行

$（this）.text（）

即可显示您单击的链接

编辑代码：

  $('.archiveDelete a').click(function(){
    //alert($(this).text());
    var all=$(this).text();
    alert(all);
  });

要获取链接的链接，请执行以下操作：

要显示

活动

请参阅此小提琴：

试试这个

$('.archiveDelete a').click(function(){
    alert($(this).text());
  });

试试这个

$('.archiveDelete a').click(function(){
    alert($(this).text());
  });

---

试试这个，我已经把这个类（achievedelete）换到了下一个div

  <div class="">
    <div class="archiveDelete">
    active | 
    <a href="javascript:void(0)">archived</a>&nbsp;|&nbsp;<a href="javascript:void(0)">deleted</a>
    </div>
  </div>

  $('.archiveDelete a').click(function(){
    var all=$('.archiveDelete').contents();
     var str = all.first().text().replace('|','');
      all.first().replaceWith( "<a href='javascript:void(0)'>"+str+"</a> | " );

  });

主动|
| 
$（'.archiveDelete a'）。单击（函数（）{
var all=$（'.archiveDelete'）.contents（）；
var str=all.first（）.text（）.replace（'|'，''）；
all.first（）替换为（“|”）；
});

试试这个，我已经把这个类（achievedelete）移到了下一个div

  <div class="">
    <div class="archiveDelete">
    active | 
    <a href="javascript:void(0)">archived</a>&nbsp;|&nbsp;<a href="javascript:void(0)">deleted</a>
    </div>
  </div>

  $('.archiveDelete a').click(function(){
    var all=$('.archiveDelete').contents();
     var str = all.first().text().replace('|','');
      all.first().replaceWith( "<a href='javascript:void(0)'>"+str+"</a> | " );

  });

主动|
| 
$（'.archiveDelete a'）。单击（函数（）{
var all=$（'.archiveDelete'）.contents（）；
var str=all.first（）.text（）.replace（'|'，''）；
all.first（）替换为（“|”）；
});

如果要将锚定标记转换为文本，可以执行以下操作

检查小提琴

---

如果您想将锚定标记转换为文本，您可以执行以下操作

检查小提琴

---

如果确实必须这样做，要将

活动的
转换为锚定，可以使用
html（）
和
replace（）
方法：

$(this.parentNode).html(function(_, oldHTML){
    return oldHTML.replace(/(active)/, "<a href='#'>active</a>");
});

您还可以使用另一个元素而不是textNode，然后可以使用
replaceWith
方法将该元素替换为另一个元素。另一个选项是添加/删除类，然后在单击处理程序中检查元素是否具有特定的类名，如果是，则执行此操作，否则不执行任何操作

更新：

如果要将单击的元素转换为textNode：

$(this.parentNode).find('a:contains(active)') // or .find('a')
                  .replaceWith(function() { 
                       return this.textContent || this.innerText;
                  });

$(this).replaceWith(function() { 
    return this.textContent || this.innerText;
});

请注意，由于您正在动态生成
元素，因此还应委派事件：

$('.archiveDelete').on('click', 'a', function(){
  // ...
});

如果确实必须这样做，要将
活动的
转换为锚定，可以使用
html（）
和
replace（）
方法：

$(this.parentNode).html(function(_, oldHTML){
    return oldHTML.replace(/(active)/, "<a href='#'>active</a>");
});

您还可以使用另一个元素而不是textNode，然后可以使用
replaceWith
方法将该元素替换为另一个元素。另一个选项是添加/删除类，然后在单击处理程序中检查元素是否具有特定的类名，如果是，则执行此操作，否则不执行任何操作

更新：

如果要将单击的元素转换为textNode：

$(this.parentNode).find('a:contains(active)') // or .find('a')
                  .replaceWith(function() { 
                       return this.textContent || this.innerText;
                  });

$(this).replaceWith(function() { 
    return this.textContent || this.innerText;
});

请注意，由于您正在动态生成
元素，因此还应委派事件：

$('.archiveDelete').on('click', 'a', function(){
  // ...
});

请检查以下小提琴，以获取您的答案：


更改的HTML：

<div class="archiveDelete">
<!-- The links at the bottom right side of the table-->
<div class="">
    <span class="spanclass">active</span>&nbsp;|&nbsp;
    <a href="javascript:void(0)" class="links"><span class="spanclass">archived</span></a>&nbsp;|&nbsp;<a href="javascript:void(0)" class="links"><span class="spanclass">deleted</span></a>
</div>
 </div>


主动|
| 

已更改Jquery：

$( document ).ready(function() {
    $(document).on('click', '.archiveDelete a', function() {
        var thistext = $(this).text();
        //$(this).replaceWith("<span class='spanclass'>"+$(this).text()+"</span>");
        $(this).contents().unwrap();
        alert(thistext);
        $( ".spanclass" ).each(function() {
            var spantext = $(this).text();
            //alert(spantext);
            //alert($(this).parent('a').length);
            if(thistext!=spantext && $(this).parent('a').length == 0) {
                $(this).wrap( "<a href='javascript:void(0)' class='links'></a>" );
            }
        });

    });
});

$（文档）.ready（函数（）{
$（文档）.on（'click'，'archiveDelete a'，function（）{
var thistText=$（this.text（）；
//$（this.replace为（“+$（this.text（）+”）；
$（this.contents（）.unwrap（）；
警报（本文）；
$（“.spanclass”）。每个（函数（）{
var spantext=$（this.text（）；
//警报（文本）；
//警报（$（this）.parent（'a'）.length）；
if（thisttext！=spantext&&$（this.parent（'a'）。长度==0）{
$（this.wrap（“”）；
}
});
});
});

单击锚定后，它将更改为简单文本，其余部分将成为锚定

如有任何疑问，请检查并回复。
请检查以下小提琴以获得答案：


更改的HTML：

<div class="archiveDelete">
<!-- The links at the bottom right side of the table-->
<div class="">
    <span class="spanclass">active</span>&nbsp;|&nbsp;
    <a href="javascript:void(0)" class="links"><span class="spanclass">archived</span></a>&nbsp;|&nbsp;<a href="javascript:void(0)" class="links"><span class="spanclass">deleted</span></a>
</div>
 </div>


主动|
| 

已更改Jquery：

$( document ).ready(function() {
    $(document).on('click', '.archiveDelete a', function() {
        var thistext = $(this).text();
        //$(this).replaceWith("<span class='spanclass'>"+$(this).text()+"</span>");
        $(this).contents().unwrap();
        alert(thistext);
        $( ".spanclass" ).each(function() {
            var spantext = $(this).text();
            //alert(spantext);
            //alert($(this).parent('a').length);
            if(thistext!=spantext && $(this).parent('a').length == 0) {
                $(this).wrap( "<a href='javascript:void(0)' class='links'></a>" );
            }
        });

    });
});

$（文档）.ready（函数（）{
$（文档）.on（'click'，'archiveDelete a'，function（）{
var thistText=$（this.text（）；
//$（this.replace为（“+$（this.text（）+”）；
$（this.contents（）.unwrap（）；
警报（本文）；
$（“.spanclass”）。每个（函数（）{
var spantext=$（this.text（）；
//警报（文本）；
//警报（$（this）.parent（'a'）.length）；
if（thisttext！=spantext&&$（this.parent（'a'）。长度==0）{
$（this.wrap（“”）；
}
});
});
});

单击锚定后，它将更改为简单文本，其余部分将成为锚定

请检查并回复任何查询。
您可以将“活动”放在自己的
中吗？这也将允许您在这些跨距上添加边距，因此您不需要
s。个人偏好，但我觉得这些很烦人。在哪个链接上单击？
innerHTML（）
不起作用。您是否尝试在单击其他活动链接时将其变为链接，反之亦然？尝试将“活动”变为自己的
？这也将允许您在这些跨距上添加边距，因此您不需要
s。个人偏好，但我觉得这些很烦人。在哪个链接上单击？
innerHTML（）
不起作用。你是否尝试在单击其他活动链接时将其变为链接，反之亦然？尝试我可以轻松获得单击的链接，但我需要获得div上的文本而不是链接你所说的文本是什么意思<代码>href
不，请仔细阅读我的问题。我不需要href，我必须将文本
活动
更改为hrefI，轻松获取单击的链接，但我需要获取div上的文本而不是链接你所说的文本是什么意思<代码>人力资源