0

Say for example you have the following setup: 

<div class="blah"><!--start--><!-- stop --></div>

I was wondering how one would go about inserting content between the "start" & "stop" html comment lines?

I have found this link to be somewhat useful, and I managed to get my content to load, but it keeps on loading it below the "stop" comment.

Any ideas?

Improve this question
28
  • 3
    Why don't you create a div between start and stop, and then append the content to it? Commented Oct 15, 2013 at 13:51
  • Is there a pattern in your html we can see? Commented Oct 15, 2013 at 13:52
  • stackoverflow.com/questions/3769964/… this will help you out Commented Oct 15, 2013 at 13:53
  • What would be the practical use for this? Commented Oct 15, 2013 at 13:54
  • 1
    @dbanet "who said the comments mark the start and end of a div?" The example in the question says that. I feel like you are looking for a way to make sense of this, but the asker isn't inserting a million placeholders, and if he was I doubt a million AJAX requests is the right way to do it. All we see is one comment with one div. Any speculation otherwise is pointless. We are getting off-topic. If you can quickly throw together a jsfiddle which illustrates the value of this, and perhaps add it to your answer, I would appreciate it. But this conversation is too theoretical. Commented Oct 15, 2013 at 14:21

3 Answers 3

Reset to default
4 
 $('.blah').contents().filter(function () {
     return this.nodeType == 8;
 }).first().after('test');

jsFiddle example

Returns:

<div class="blah">
    <!--start-->test<!-- stop -->
</div>
Improve this answer
Sign up to request clarification or add additional context in comments.

11 Comments

@dbanet - what do you mean?
The code above will insert your content after the first comment ( nodeType == 8 ), not necessarily between <!--start--> and <!--stop-->
@dbanet - did I say you were?
Reread the code and got it... I really have to discover jQuery :)
@j08691 - You sir (or madam, i have not checked your profile) are the genius of the lantern! with a bit of tweaking it works like a dream.
|
0

This will insert your content after <!--start-->

var newContent = "<strong>New!</strong>",
    mergedContent = $('.blah').html().replace("<!--start-->","<!--start-->"+newContent);
$('.blah').html(mergedContent);
Improve this answer

2 Comments

Thing is I don't want to replace the comments, I just wish to add content between the two comments. If I understand this correctly .replace("<!--start-->","<!--start-->"+newContent); means: Replace <!-- start --> with <!-- start -->and the new content as defined above? Wont it be possible to just find the <!-- start --> comment and drop in the content after that?
You're replacing <!--start--> with <!--start--> plus the new content which has the same result as inserting after. This will not affect the placement of <!--start--> in the DOM. Will you not know what the exact comment will be?
0

Well, I'll hardcode this:

var content="Insert me in:)";
[].forEach.call(document.getElementsByClassName('blah'),function(e){
    e.innerHTML=e.innerHTML.split('start--><!--stop')[0]+"start-->"
               +content+
               "<!--stop"+e.innerHTML.split('start--><!--stop')[1];
});
Improve this answer

2 Comments

Ahh, sorry, "jQuery" badge... should I rewrite this more bulls^WjQueryish?
How would you (with this method) pull in content from an external html file? Say you had a div in another file called "bleh", how would you go about? Would you define a variable that points to that file and div like var $main = $('flooz/flaz.html #container_burp .bleh') ?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.