正则表达式Javascript-删除两个HTML注释之间的文本

Question

Well I have two html comments like this:

<!--Delete-->
Blah blah
blah blah
<!--Delete-->

And I want to remove it (including the comments, any character and newlines). Btw I am using javascript and Grunt to make the replacement.

Thanks

Answer 1

Regex

Use the following JavaScript Regular Expression to match multiple instances of your custom .html comments and the content inside them:

/\<\!\-\-Delete\-\-\>((.|[\n|\r|\r\n])*?)\<\!\-\-Delete\-\-\>[\n|\r|\r\n]?(\s+)?/g

---

Then register a custom Function Task inside your Gruntfile.js as shown in the following gist:

Gruntfile.js

module.exports = function (grunt) {

    grunt.initConfig({
        // ... Any other Tasks
    });

    grunt.registerTask('processHtmlComments',
        'Remove content from inside the custom delete comments',
        function() {
            var srcDocPath = './src/index.html', // <-- Define src path to .html
                outputDocPath = './dist/index.html',// <-- Define dest path for .html

                doc = grunt.file.read(srcDocPath, {encoding: 'utf8'}),
                re = /\<\!\-\-Delete\-\-\>((.|[\n|\r|\r\n])*?)\<\!\-\-Delete\-\-\>[\n|\r|\r\n]?(\s+)?/g,
                contents = doc.replace(re, '');

            grunt.file.write(outputDocPath, contents, {encoding: 'utf8'});
            console.log('Created file: ' + outputDocPath);
        });

    grunt.registerTask('default', [
        'processHtmlComments'
    ]);

};

Additional notes

Currently running $ grunt via the CLI does the following:

1. Reads a file named index.html from the src folder.
2. Deletes any content from inside the starting and closing custom comments, <!--Delete--> , including the comments themselves.
3. Writes a new index.html , excluding the unwanted content, to the dist folder.

Both the values for srcDocPath and outputDocPath will probably need to be redefined as per your projects requirements.

---

EDIT Updated Regex to also allow inline comment usage. For example:

<p>This text remains <!--Delete-->I get deleted<!--Delete-->blah blah</p>

Answer 2

In the below regex, we check with a word starts with
\\<\\! => after escape => <!
Then (.)* for anything
then skip first tag end \\-\\>
Then anythig (.)*
Then at end of comment \\-\\-\\>
and check for a global match g ;

 var text="<div>hello there</div><!--Delete-->Blah blahblah blah<!--Delete--><span>Hello world</span>"; var re=/\\<\\!(.)*\\-\\>(.)*\\-\\-\\>/g; console.log(text.replace(re,"")); 

But generally HTML comments look like

<!--comments blah blah blah //-->

for that , here is another regex

 var text = "<span>Hi there</span><div>Hello world</div><!--comments blah blah blah //--><span>something</span>"; var re=/\\<\\!\\-(.)*\\/\\/\\-\\-\\>/g; console.log(text.replace(re,""));