I have a weird sort of use-case where our blogging tool appends a <!-- Read More -->
into a post and anything above that gets pushed to our listing page.
What I want to do is find the matching comment, then tell any <p>
tag above it (in the DOM) should be set to .hide()
or .remove()
. Here is what I have started, I'm not quite sure if I can select a .prevAll
on an HTML comment.
var content = $('.main').html();
//search for matching comment
var comment = content.match(/<!--.*?-->/);
alert(comment);
comment.prevAll('p').remove();
Is there anyway to go about accomplishing this task?
You could get any comments filtering nodeType
and checking for specific value, eg:
//find read more comment $('*').contents().filter(function() { return this.nodeType === 8 && this.nodeValue.trim() === "Read More"; }).prevAll('p').hide();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="main"> <p> jhkdsjhjlasfkdldfasdfd </p> <div> no-hide </div> <p> jhkdsjhjlasfkdldfasdfd </p> <!-- Read More --> <p> dfasfsfkljfaskf;sa </p> <!-- test --> </div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.