Question

我有一个HTML代码，我想用JavaScript替换一些东西。

#---------car.pm----------
package car;

sub new
{ 
  my $class = shift;
  my $self = {};
  bless ($self, $class);

  if(ref($self) eq "car")    # thats my check to make sure beep exists
  { die "no allowed because no beep here"; 
  }

  $return $self;
}

sub honk
{ beep ();    # only defined in the inherited class (van, ...)
}

1;


#----van.pm-----
package van;

use car;
use base ("car");

sub beep 
{
   print "tuuuut";
}
1;

#---------main.pl---------
car->new ()->honk ();   # dies
# if no ref-check it would crush because no beep in car.

van->new ()->honk ();   # ok but maybe not most elegant

现在我想将“旧文本”更改为另一个像“新文本”。

如果有可能请告诉我。

Answer 1

您必须在DOM中找到您的元素元素，最好使用class或/和id propreties。

但是如果您不允许编辑DOM，您必须找到一种方法来查找所需的元素，例如跨越具有id或class的父母。

获取此课程childdiv的第一个元素。
在上面找到的元素中获取第一个a标记。
将找到的元素的innerHTML设置为所需的值exp：New Text。

Javascript（正如您所要求的）

<div class="maindiv">
    <div class="childdiv">
        <a href="www.abc.com" rel="prev">Old Text</a>
    </div>
</div>
<script>
document.getElementsByClassName("childdiv")[0].getElementsByTagName('a')[0].innerHTML="New Text";

</script>

Jquery（与上面相同的逻辑）

$(document).ready(function(){
  $(".childdiv a").text("New Text");
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="maindiv">
    <div class="childdiv">
        <a href="www.abc.com" rel="prev">Old Text</a>
    </div>
</div>

Answer 2

您可以使用

访问此类DOM对象

document.getElementsByClassName("childdiv")[0].childNodes[1].textContent="Updated Text";

Answer 3

您只需使用document.getElementById("my-link").innerHTML = "New Text"，但您应该在id标记中添加<a>属性，如下所示：

<a id="my-link" href="www.abc.com" rel="prev">
   ^^^^^^^^^^^^

或者，如果您不想编辑原始HTML上的任何内容（不良做法）：

document.getElementsByTagName("a")[0].innerHTML = "New Text";

Answer 4

我真的不明白你的问题，但我已经尝试了这个并且它正在工作......

<div class="maindiv">
   <div class="childdiv">
      <a href="www.abc.com" class="link" rel="prev">Old Text</a>
   </div>
</div>

和jQuery

$(".link").click(function(e){
   e.preventDefault();
   $(this).text("New Text");
});

https://jsfiddle.net/294m3my6/

如果你想要JavaScript

<div class="maindiv">
   <div class="childdiv">
      <a href="www.abc.com" id="link" rel="prev">Old Text</a>
   </div>
</div>

和JS

function Action(evt) {
    evt.preventDefault();
    document.getElementById("link").innerHTML = "Next Text";
}

document.getElementById('link').addEventListener(
    'click', Action, false
);

https://jsfiddle.net/ep3v5u0k/

Answer 5

@Amani解决了我的问题。这就是我想要的。

<div class="maindiv">
<div class="childdiv">
    <a href="www.abc.com" rel="prev">Old Text</a>
</div>
</div>
<script>
document.getElementsByClassName("childdiv")[0].getElementsByTagName('a') [0].innerHTML="New Text";

非常感谢你们所有人阿曼尼。

如何使用JavaScript替换链接文本

5 个答案:

Javascript（正如您所要求的）

Jquery（与上面相同的逻辑）