简体   繁体   English

从字符串中找到&#39;*&#39;,&#39;**&#39;和&#39;`&#39;并替换为 <strong></strong> 和

[英]find '*' , '**' and '`' from string and replace with <strong></strong> and <code></cod in javascript, Typescript

we need to process an "string" and surround all text between '*' and '**' with <strong></strong> and similarly the text between backTic with <code> </code> . 我们需要处理一个“字符串”并用<strong></strong>包围'*'和'**'之间的所有文本,以及backTic和<code> </code>之间的文本。 Now I have written the logic, and it works fine as well, but I am sure, there must be a better way as it is too much code for this simple task of string processing. 现在我已经编写了逻辑,它也运行良好,但我确信,必须有一个更好的方法,因为这个简单的字符串处理任务的代码太多了。 Following is my code. 以下是我的代码。 Appreciate any suggestions. 感谢任何建议。

input = "*within single star* and **within double start** and this is `backtick string`" input = "*within single star* and **within double start** and this is `backtick string`"

output = "<strong>within single star</strong> and <strong>within double start</strong> and this is <code>backtick string</code>" output = "<strong>within single star</strong> and <strong>within double start</strong> and this is <code>backtick string</code>"

transform(data: any) {
        if (data) {
            const processDblStar = (input) => {
                const regExforDoubleStar = /(\*\*)+/gi;
                let i = 0;
                const result = input.replace(regExforDoubleStar, (match, matchedStr, offset) => {
                    i++;
                    return i % 2 === 0 ? '</strong>' : '<strong>';
                });
                return result;
            };

            const processSingleStar = (input) => {
                const regExforSingleStar = /(\*)+/gi;
                let i = 0;
                const result = input.replace(regExforSingleStar, (match, matchedStr, offset) => {
                    i++;
                    return i % 2 === 0 ? '</strong>' : '<strong>';
                });
                return result;
            };

            const processBackTick = (input) => {
                const regExforBackTick = /(\`)+/gi;
                let i = 0;
                const result = input.replace(regExforBackTick, (match, matchedStr, offset) => {
                    i++;
                    return i % 2 === 0 ? '</code>' : '<code>';
                });
                return result;
            };

            const processPipeline = (functions) => (inputStr) => functions.reduce((result, fn) => fn(result), inputStr);

            const funcArr: Function[] = [];
            if (data.indexOf('`') >= 0) {
                funcArr.push(processBackTick);
            }
            if (data.indexOf('*') >= 0) {
                funcArr.push(processSingleStar);
            }
            if (data.indexOf('**') >= 0) {
                funcArr.push(processDblStar);
            }

            processPipeline(funcArr)(data);
        }
    }

You can use regex to group all the text between ** and * . 您可以使用正则表达式对***之间的所有文本进行分组。 Using this group, you can then use it in your replacing string by referencing it using $1 . 使用此组,您可以通过使用$1引用它来在替换字符串中使用它。 We can also do the same thing with the backticks, however, instead, surround the matched group in <code></code> tags. 我们也可以使用反引号做同样的事情,但是,在<code></code>标记中包围匹配的组。

 const str = '*within single star* and **within double start** and this is `backtick string`'; const proccessPipeline = s => s.replace(/\\*{1,2}(.*?)\\*{1,2}/g, '<strong>$1</strong>') .replace(/`(.*?)`/g, '<code>$1</code>'); const res = proccessPipeline(str); console.log(res); document.body.innerHTML = res; 

not the best way to do this. 不是最好的方法。 but short code. 但是短代码。

 var converter = new showdown.Converter(); var input = "*within single star* and **within double start** and this is `backtick string`"; var output = converter.makeHtml(input); output = "\\"" + output + "\\"" output = output.replace(/<p>/g, "") output = output.replace(/<\\/p>/g, "") output = output.replace(/<em>/g, "<strong>") output = output.replace(/<\\/em>/g, "</strong>") console.log(output) 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.0/showdown.min.js"></script> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM