以下是我的 React 組件的片段
<div className="grid lg:grid-cols-2 xl:grid-cols-1 lg:gap-x-5">
<article className={`${index > 0 ? 'border-t lg:border-t-0 xl:border-t border-gray-300/70' : ''} py-8 sm:flex xl:items-center lg:flex-col xl:flex-row`}>
...
</article>
</div>
我需要獲取組件中的所有類。我能夠className="grid lg:grid-cols-2 xl:grid-cols-1 lg:gap-x-5"使用以下正則運算式匹配其中的類：
/(?<=className=")(.*)(?=")/g
但是，我不知道如何匹配類
className={`${index > 0 ? 'border-t lg:border-t-0 xl:border-t border-gray-300/70' : 'text-gray-900'} py-8 sm:flex xl:items-center lg:flex-col xl:flex-row`}
例如，我需要"border-t lg:border-t-0 xl:border-t border-gray-300/70 text-gray-900 py-8 sm:flex xl:items-center lg:flex-col xl:flex-row"在上面的例子中進行匹配。
uj5u.com熱心網友回復：
您可以嘗試 3 個正則運算式的組合：
腳本：
function myFunction() {
text = "<div className=\"grid lg:grid-cols-2 xl:grid-cols-1 lg:gap-x-5\">\
<article className={`${index > 0 ? 'border-t lg:border-t-0 xl:border-t border-gray-300/70' : 'text-gray-900'} py-8 sm:flex xl:items-center lg:flex-col xl:flex-row` }\
...\
</article>\
</div>";
console.log(text.match(/(?<=\?\s?')([^']*)(?='(\s?:|\s?}))|(?<=}\s?)([^`]*)(?=`\s?})/g).join(' '))
}
輸出：
筆記：
- 如果您只需要文章標簽內的類名，您可能需要
article className在下面的正則運算式之前添加檢查，因為下面的正則運算式可能會在單引號 ('') 之間選擇其他類。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/467261.html
標籤：javascript 反应 正则表达式 jsx