Created
July 29, 2020 09:17
-
-
Save bartwttewaall/02041c4c28661bb537c37b2b90912dcb to your computer and use it in GitHub Desktop.
Parse html links in a string to an object
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const linkPattern = /<a\s?(.*?)>([^<\/]*)<\/a>/gim; | |
const contentPattern = /(?:>)(.*?)(?:<)/; | |
const attrPattern = /\b(\S+)="(.*?)(?=")\b/gim; | |
const text1 = 'This is an <a href="#1" rel="noopener">example</a> and here we have <a href="#2" role="button">another one</a>'; | |
const text2 = 'This is an example and here we have <a class="test">another one</a>'; | |
const text3 = 'This is an <a id="empty">empty</a> example'; | |
const text4 = 'This is a bad <a id="unsupported" /> example'; | |
getHtml(text1); // [ { tag: 'a', text: 'example', href: '#1', rel: 'noopener' }, { tag: 'a', text: 'another one', href: '#2', role: 'button' } ] | |
getHtml(text2); // [ { tag: 'a', text: 'another one', class: 'test' } ] | |
getHtml(text3); // [ { tag: 'a', text: 'empty', id: 'empty' } ] | |
getHtml(text4); // [] | |
function getHtml(input: string) { | |
const result = input.match(linkPattern); | |
return [].slice.call(result || {}).map(link => { | |
const tag = 'a'; | |
const text = getContent(link); | |
const attributes = getAttributes(link); | |
return Object.assign({ tag, text }, ...attributes); | |
}); | |
} | |
function getContent(text: string) { | |
const result = text.match(contentPattern); | |
return result ? result[0].slice(1, result[0].length - 1) : ''; | |
} | |
function getAttributes(text: string, asObject: boolean = true) { | |
const result = text.match(attrPattern); | |
return [].slice.call(result || {}).map(part => { | |
const [key, value] = part.split('="'); | |
return asObject ? {[key]: value} : [key, value]; | |
}); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment