最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Find element with rel attribute and change text - Stack Overflow

programmeradmin2浏览0评论

I have a pagination for browsing older posts. I need to change it's text using jquery or js. (pagination generated in laravel package so can't edit text directly)

So I tried with finding rel and replace text. But no luck. This is my code.

$(".older-posts").find("li[rel='next']").html("Older posts");
<script src=".1.1/jquery.min.js"></script>
<div class="older-posts">
  <ul class="pagination">
    <li>
      <a href="http://localhost/pages/blog?page=1" rel="prev">« Previous</a>
    </li>
    <li class="disabled"><span>Next »</span></li>
  </ul>
</div>

I have a pagination for browsing older posts. I need to change it's text using jquery or js. (pagination generated in laravel package so can't edit text directly)

So I tried with finding rel and replace text. But no luck. This is my code.

$(".older-posts").find("li[rel='next']").html("Older posts");
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="older-posts">
  <ul class="pagination">
    <li>
      <a href="http://localhost/pages/blog?page=1" rel="prev">« Previous</a>
    </li>
    <li class="disabled"><span>Next »</span></li>
  </ul>
</div>

Any idea?

Share Improve this question edited Nov 15, 2017 at 11:21 Janath asked Nov 15, 2017 at 11:18 JanathJanath 1,2486 gold badges28 silver badges61 bronze badges 2
  • 2 Your HTML has no span[rel="next"] element – Rory McCrossan Commented Nov 15, 2017 at 11:19
  • you could use contains .find("span:contains('Next')") – Pete Commented Nov 15, 2017 at 11:25
Add a ment  | 

2 Answers 2

Reset to default 6

pure js solution:

Please Note: querySelectorAll returns an array, so position of li matters; if u change position of "prev" li , then this code might behave naughty.

Cheers

document.querySelectorAll('[rel="prev"]')[0].innerHTML = "Older posts";

Approach 2:

If you feel that above code is inplete for the reason I mentioned, use this approach instead

var lists = document.querySelectorAll("li")

var filteredList = Array.prototype.filter.call(lists,function(node) {   return node.innerHTML.includes("Previous"); });

filteredList[0].innerHTML = "Older posts";

$('[rel="prev"]').text('your text here')

发布评论

评论列表(0)

  1. 暂无评论