Finding a character that appears either once or thrice

In my work on JavaScript regex for markdown formatting, I am trying to match instances where a single underscore (_) or asterisk (*) occurs once (at the beginning, end, or surrounded by other characters or whitespace), as well as occurrences of three underscores (_ _ _) or asterisks (* * *)

Examples of successful matches would be a single asterisk (*) and three asterisks (* * *), while phrases like **a and **_ would not be considered matches.

The goal is to identify elements that are italic (*italic*) or bold and italic (***bold italic***) formatted in markdown. Other variations like _** italic bold **_ should also be matched.

I currently have some patterns in place, but they don't seem to be fully effective. If possible, I'd like to consolidate this into one regex pattern.

(^|[^_])_([^_]|$)
(^|[^_])_([^_]|$)
(^|[^\*])\*([^\*]|$)
(^|[^\*])\*\*\*([^\*]|$)

// EDIT

Matching examples for *****

*em*
***em***
__*em*
__*em*__
word*em*word

Non-matching examples for *****

**em**
****em****

Answer №1

Based on my interpretation, I am confident that this regular expression will do the job:

(?:^|[^*])_*([*](?:[*]{2})*)?[^*_]+\1_*(?:[^*]|$)

Check out the Online Demo: http://regex101.com/r/qX5gR6

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

What is the process for obtaining the Tag from a React Component?

Not the HTML DOM element tag, the JSX tag, the react class name. As I work on creating an editor, adding items to the canvas array requires me to check and call the appropriate method based on what is being added. A simplified version of my idea: changeS ...

Can you explain the error message "a.split is not a function" in an Angular context?

My Angular application is encountering an error upon page load. The error message displayed is as follows: angular-amin.js:122 TypeError: a.split is not a function at r (angular-amin.js:186) at m.$digest (angular-amin.js:145) at m.$apply (angular-ami ...

Navigate through the options on the left menu by sliding your

I'm attempting to create a menu that slides in a submenu from the left on hover, but the issue is that with this code, all submenus open instead of just the one related to the hovered link. Here is my HTML code: <ul id="NavMenu"> ...

MooTools Request Unsuccessful

I'm encountering a problem with MooTools where every time I try to send a request, it fails. I'm having trouble figuring out the issue because when I attempt to retrieve the header info, the console just displays "Refused to get unsafe header &ap ...

Tips for utilizing the "this" keyword in JavaScript in conjunction with the change function

I'm currently facing an issue with the change function. I have two dropdowns that are dependent on each other. Whenever the first dropdown changes, it triggers a change in the second dropdown as well. I achieved this functionality using jQuery AJAX. H ...

Expand the table in the initial state by using CSS to collapse the tree

I am struggling to collapse the tree view and need assistance. Below is the code snippet I've added. My goal is to have each node in the tree view initially collapsed and then expand a particular node on user interaction. For example, when I execute ...

Utilizing a different file to arrange and establish state

In a separate file called Origin.js, I have some data (objects) stored. This data is exported using the spread operator within an object named OriginState: Origin.js //info const info = { title: '', year: '', }; //images const ...

After placing two divs within another div and applying justify content, an unexpected blank space has appeared

I am currently working on a website project using the Next.js framework for React and Tailwind CSS for styling. However, I have come across an issue that is causing some trouble. My goal is to position an image on the right side of the page while keeping t ...

Achieve a full page layout with content and attach the footer to the bottom using flexbox in Tailwindcss and Nextjs

How can I use flex-grow to make the body section fill the screen and keep the nav fixed at the bottom? I'm having trouble figuring out which elements to apply these properties to. Can anyone provide guidance on which element should have these styles? ...

`Custom transitions between sections using fullpage.js`

Has anyone used the fullpage.js extension to achieve an animation similar to this one, where sections are destroyed on scroll? ...

Creating various iterations of a single CSS animation

Attempting to animate multiple instances of a cross mark animation can be tricky. The animation works well with one instance, but struggles when trying to create more than one. The challenge lies in controlling the size and position of each cross animation ...

Odd behavior of dropdown list on Internet Explorer 8

Thank you for taking the time to review this. I have a dynamic dropdown list that changes its content based on a specific value (for example, "51") inputted into the JavaScript code on each page. Different pages display different lists depending on this va ...

Error encountered while using XLSX.write in angular.js: n.t.match function is not recognized

I've encountered an issue while trying to generate an .xlsx file using the XLSX library. The error message I received is as follows: TypeError: n.t.match is not a function at Ps (xlsx.full.min.js:14) at Jd (xlsx.full.min.js:18) at Sv (xlsx.full.min ...

Custom-designed background featuring unique styles

I have implemented the following code to create a continuous running banner: <style> #myimage { position: fixed; left: 0%; width: 100%; bottom: 0%; background:url("http://static.giga.de/wp-content/uploads/2014/08/tastatur-bild ...

Troubleshooting React-Redux: Button click not triggering action dispatch

I am facing an issue where my action is not being dispatched on button click. I have checked all the relevant files including action, reducer, root reducer, configStore, Index, and Component to find the problem. If anyone can help me troubleshoot why my a ...

Deciding whether an altered image has been successfully loaded

Currently, I am stuck on a minor point while creating a small gallery using jQuery. The code snippet looks like this: <script type="text/javascript> $(document).ready(function(){ $('#thumb1').click(function(){ $('#fullimage ...

Tips for positioning a box on top of a map in a floating manner

I am trying to figure out how to position the div with class box on top of the map in this jsbin. Can someone help me achieve this? Below is the CSS code I have for styling the box and body. body { font-family: "Helvetica Neue", Helvetica, sans-serif; ...

Working with Vue.js: Utilizing computed properties to iterate through a JSON data structure and generate a new

This is a computed property in Vue.js: shopCart() { var scart = [], group, node; scart.push({ payMethod: 0, transactionReference: "", RoomNumber: 0, addressId: 0, deliveryMinutes ...

Determine if a webpage forwards to a new link with the help of phantomjs, flagging any issues exclusively for designated websites

As a beginner in frontend development, I have a question that may seem simple. Please be patient with me. var page = require('webpage').create(), system = require('system'); if (system.args.length === 1) { console.log('Usage: ...

Notification fails to display following POST request

Whenever the select menu displays "Please select your country" and I click the checkout button, an alert pops up. But if I select Canada, then go back to selecting "Please select your country" and press checkout, no alert appears. I need the alert to alway ...