Question

我想在锚文本中获取文本并在p标签中显示

示例： -

<p class="post">
some content
<span more-description="here is read more description">...</span>
<a class="readmore">Read More</a>
</p>

所以点击“阅读更多”文字后。

新的源代码将是： -

<p class="post">
some content
<span class="full">here is read more description</spn>
<span more-description="here is read more description" style="display:none;">...</span>
<a class="readmore">Read More</a>
</p>

Answer 1

$(document).ready(function(){
 $('.readmore').click(function(){
    var span=$('<span>');
    span.addClass('full').text($('[more-description]').attr('more-description'));
    $('p').prepend(span);
    $('[more-description]').hide()
  })
})

Answer 2

简单的Javascript：

document.querySelector(".readmore").onclick = function () {
 var span = document.createElement('span');
 span.className = 'full';
 span.innerHTML = 'here is read more description';
 var post = document.querySelector('post');
 post.insertBefore(span, post.childNodes[0]);
 post.childNodes[1].style.display = 'none';
}

Answer 3

没有其他框架的简单方法：

<p class="post">
  some content
<span class="full" style="display:none">here is read more description</span>

<span more-description="here is read more description" style="display:none;">... </span>
<a class="readmore" onclick="document.getElementsByClassName('full')[0].style.display='block';" >Read More</a>
</p>

或display ='inline-block'

在Anchor标签内获取文本

3 个答案: