Ways to extract a substring located between two specific strings while accounting for escaped characters

My current task involves extracting strings between two specified tags. Here is the code that accomplishes this:

if (text.toLowerCase().indexOf("[CUSTOMTAG]") >= 0) {
      _data = /\[CUSTOMTAG](.*?)\[\/CUSTOMTAG]/g.exec(text);
      if (_data[1] && _data[1].length > 0) {
        const data = _data[1];
      }
    }

However, I encountered an issue when the string between the tags contains special characters like:

[CUSTOMTAG]this is some
[/ru ugly content here[/CUSTOMTAG]

When this occurs, I receive an exception stating Cannot read property '1' of null due to parsing failure. Is there a way to bypass escaping characters within the string?

Answer №1

While it may not be the most elegant solution, this code does get the job done. It might require some tweaking to fit your specific needs, but here's an alternate approach:

var input = `[CUSTOMTAG]this is some [/ru ugly content here[/CUSTOMTAG] [CUSTOMTAG]test2[/CUSTOMTAG]`;
var startIndex = 0, endIndex = 0, results = [];
while ((endIndex = input.indexOf("[/CUSTOMTAG]", endIndex)) >= 0 && (startIndex = input.indexOf("[CUSTOMTAG]", startIndex)) >= 0) {
results.push(input.substring(startIndex + "[CUSTOMTAG]".length, endIndex));

endIndex += "[/CUSTOMTAG]".length;
startIndex += "[CUSTOMTAG]".length;
}
console.log(results);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

"Experience the power of Angular.js through seamless animations created by blending the capabilities

I want to smoothly fade out the old view and fade in the new view. The challenge is that the new content must be positioned absolutely until the old one fades out. I also want to set a specific top position and height for the new content, but when I try to ...

When scrolling, custom cursor object disappears from view as it moves along with the mouse

My goal is to have a custom object follow the mouse by changing the translate property and assigning x and y values to it. Everything works fine initially, the object appears and moves within the first frame. However, when scrolling down, the transform pro ...

Javascript is throwing a reference error because it can't find a definition for StringBuilder

I have a JavaScript function that utilizes a string builder function. It works smoothly in most major browsers like IE8+, Chrome, and Firefox but occasionally I encounter an error stating "stringbuilder is not defined". This issue seems to only affect cert ...

How can I use jQuery to target elements other than the vertical scrollbar when

Here is how I am utilizing the mouseleave jquery event $(document).ready(function(){ $(document).mouseleave(function(event) { //perform a task }); }); Is there any method to prevent this event from triggering when a user scrolls ...

Tips for seamlessly playing flowplayer while an mp4 file is loading?

Is there a way for the video to play while it is buffering, rather than waiting for the mp4 to be fully loaded? Thank you. ...

Changing the key name for each element in an array using ng-repeat: a guide

In my current project, I have an array of objects that I am displaying in a table using the ng-repeat directive. <table> <thead> <tr> <th ng-repeat="col in columnHeaders">{{col}}</th> //['Name&apo ...

Arrange the objects in the array in React based on their time and date of creation

As a newcomer to the world of React.js and Redux, I am faced with an array of objects structured like this: quizList = [ { createdDate : 1543314832505, id:5bfd1d90d4ed830001f589fc, name:'abc'}, { createdDate : 1543314152180, id:5bfd1ae8d4ed83000 ...

Utilizing the index of a generic type within TypeScript

I am attempting to design generic message types that become increasingly specific, with the most precise type being inferred during the function call or class creation. Consider the following code snippet: type MessageHeaderType = 'REQUEST'|&apo ...

Passing an array of items as a property to a child component in React with Typescript is not possible

In my project, I have multiple classes designed with create-react-app. I am trying to send an array of objects to child components as illustrated below. Items.tsx import * as React from 'react'; import ItemTable from './ItemTable'; imp ...

The issue of underscorejs being undefined arises when trying to load it using both XMLHttpRequest and

I am attempting to dynamically load underscorejs using XMLHttpRequest and eval function function includeScriptSync(scriptUrl) { var xmlhttp = new XMLHttpRequest(); xmlhttp.open("GET", scriptUrl, false); xmlhttp.onreadystatechange = function() ...

Different browsers have varying ways of handling transition end callbacks with AddEventListener()

Each browser has its own transition end callback. Therefore, I find myself needing to use addEventListener() for each one. addEventListener('transitionend', function() { // code here }); addEventListener('webkitTransitionEnd', funct ...

Navigating through playlists on Ionic

Having just started exploring Ionic, I find myself in need of assistance with regards to navigation. I kicked off the project utilizing the sidemenus starter template which is a basic structure displaying items in a playlist using a playlist control. Howev ...

Using JavaScript functions within PHP is not supported

Currently, I am utilizing Laravel for my backend operations. Within my setup, there exists a JavaScript function called StartJob() that facilitates Google crawling. In the scenario where I input a keyword, which is then cross-referenced with the database, ...

The use of '-' in v-bind:style within Vue.js

I'm having trouble figuring out how to use CSS code with dashes in v-bind:style. When I attempt something like this: <DIV style="width:100px;height: 100px;background-color: red;cursor: pointer;" v-bind:style="{ margin-left: margin + 'px' ...

The loading animation does not appear in the NextJS 14 - loading.tsx component while a GET request is being processed

Component with 500 photos displayed on my page: 'use client'; import { useEffect, useState } from 'react'; import { wait } from '@/components/loaders/skeletons'; export default function Postings() { const [photos, setPhotos ...

Tips for sending information from an AJAX request to a Laravel 5.2 controller using the POST method

Hello everyone. I'm reaching out to the great community for some assistance with my first question here. I've recently started working with Laravel framework version 5.2 in a project of mine. My issue lies in trying to pass data using the post m ...

Split a JavaScript string at a mathematical operator while ensuring that the operator is still included in

Hello there, I am attempting to break down a string of text into an array whenever a '+' or '-' is present. First of all, I am looking for a way to split at the plus sign and ensure it is included in the array. I have experimented with ...

Deleting multiple subdocuments and their related subdocuments with Mongoose

In my application, I have a Project document that contains an array of subdocuments structured as Tasks. Each Task has its own array of subdocuments with a schema called Comments. const projectSchema = new Schema({ _id: Schema.Types.ObjectId, name: { ...

Tips for utilizing the useState Hook in NextJs to manage several dropdown menus efficiently:

Currently, I am in the process of designing an admin panel that includes a sidebar menu. I have successfully implemented a dropdown menu using the useState hook, but it is not functioning exactly as I had envisioned. My goal is to have the if statement onl ...

Setting up protected routes using react-router-dom version 6

When a visitor navigates to / (home), I want them to be redirected to /connexion" if they are not connected. To achieve this, I have implemented Private routes that work well. Now, I need to create the logic that will handle the redirection based on t ...