I need to change the link text, but this link does not have any identifiers to do this quickly. I do not know almost anything about Js, but I think it's possible to do this by accessing the TD and then the link.
<td class="corpo-nome">
<a href="/rota/rota1">
guilherme
</a>
</td>
This is the result I want:
<td class="corpo-nome">
<a href="/rota/rota1">
MEU NOVO TEXTO
</a>
</td>
If you want to change the text via JavaScript, follow an example in JQuery
$(document).on('ready', function(){
let novoTexto = "MEU NOVO TEXTO";
$("td[class='corpo-nome'] a:first")
.text(novoTexto)
.attr('title',novoTexto);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><table><tr><tdclass="corpo-nome">
<a href="/rota/rota1" title="guilherme">guilherme</a>
</td>
</tr>See an option with CSS, but I make it clear that it is not very semantic, because even with font 0 a screen reader can have access to that text ...
The technique is to "erase" the text within the link by setting the size of font to 0 , however you use a pseudo-element ::after in link and using the content:"" property; You put the new text.
Note that only the element that the href = /rota/rota1 attribute will receive the new text
[href="/rota/rota1"] {
font-size: 0;
color:red; /* cor de texto que o filho ::after vai herdar */
}
[href="/rota/rota1"]::after {
content: " MEU TEXTO NOVO";
font-size: 16px !important;
}<td class="corpo-nome">
<a href="/rota/rota1">
guilherme
</a>
</td>
<td class="corpo-nome">
<a href="/rota/rota2">
João
</a>
</td> If you want only the link within <td> with class .corpo-nome to have the text changed just put the css in this way
.corpo-nome a{
font-size: 0;
color:red;
}
.corpo-nome a::after {
content: " MEU TEXTO NOVO";
font-size: 16px !important;
}<table>
<tr>
<td class="corpo-nome">
<a href="/rota/rota1">
guilherme
</a>
</td>
</tr>
</table>Keep in mind that: The user may not even see the text that we hide with font-size: 0, but Google Bot is sure to read that content. you see with your eyes, but for crawlers and screen readers the text will remain accessible ...
Gustavo can do this in several ways, through jquery selectors
$(function() {
$('a:eq(0)').text('fulano'); // pega a tag 0 do documento
$('a:eq(1)').text('ciclano'); // pega a tag 1 do documento
$('a:eq(2)').text('beltrano'); // pega a tag 2 do documento
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><tdclass="corpo-nome">
<a href="/rota/rota1">
guilherme
</a>
</td>
<td class="corpo-nome">
<a href="/rota/rota2">
joão
</a>
</td>
<td class="corpo-nome">
<a href="/rota/rota3">
carlos
</a>
</td>