使用CSS或jQuery在HTML中使用標題單獨匹配字符串

我正在開發一個需要從列出的所有標題中分離字符串的項目。標題超過500個，所以很難改變它。使用CSS或jQuery在HTML中使用標題單獨匹配字符串

醫生

<div class="dr-title"><h2>Dr. Nicki Mallmann CRM 22768</h2></div> 
 
<div class="dr-title"><h2>Dr. Alexandre Manoel Varela CRM 10113</h2></div> 
 
<div class="dr-title"><h2>Dr. Arnaldo Laffitte Stier Junior CRM 9475</h2></div> 
 
<div class="dr-title"><h2>Dr. Claudinei Colatusso CRM 19994</h2></div>

所有這些列表是H2元素內包裹在HTML。

是否有任何可能性，我們可以從CRM開始分離文本，然後是它的唯一編號？

目前它看起來像上面。我要的是下面

.dr-crm { 
 
    display: block; 
 
    font-size: 12px; 
 
    }

<div class="dr-title"><h2>Dr. Nicki Mallmann <span class="dr-crm">CRM 22768</span></h2></div> 
 
<div class="dr-title"><h2>Dr. Alexandre Manoel Varela <span class="dr-crm">CRM 10113</span></h2></div> 
 
<div class="dr-title"><h2>Dr. Arnaldo Laffitte Stier Junior <span class="dr-crm">CRM 9475</span></h2></div> 
 
<div class="dr-title"><h2>Dr. Claudinei Colatusso <span class="dr-crm">CRM 19994</span></h2></div>

是否有可能使用CSS或jQuery的？我試圖尋找與CSS僞選擇器的東西，但不可能。可能與jQuery我認爲它是可能的。

來源

2016-11-10 Maqk

CSS選擇元素，而不是文本節點。使用JavaScript/jQuery，這將可能使用一個非常簡單的正則表達式。 – CBroe

在這種情況下，CSS功能不足以根據需要修改內容。

取而代之的是，你可以通過提供一個正則表達式的replace()方法，找到CRM值和任何以下字符，它們封裝在一個span實現這一目標使用Javascript。試試這個：

$('h2').html(function(i, h) { 
 
    return h.replace(/(CRM.*$)/, '<span class="dr-crm">$1</span>'); 
 
});

.dr-crm { 
 
    display: block; 
 
    font-size: 12px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="dr-title"> 
 
    <h2>Dr. Nicki Mallmann CRM 22768</h2> 
 
</div> 
 
<div class="dr-title"> 
 
    <h2>Dr. Alexandre Manoel Varela CRM 10113</h2> 
 
</div> 
 
<div class="dr-title"> 
 
    <h2>Dr. Arnaldo Laffitte Stier Junior CRM 9475</h2> 
 
</div> 
 
<div class="dr-title"> 
 
    <h2>Dr. Claudinei Colatusso CRM 19994</h2> 
 
</div>

來源

2016-11-10 13:15:59

感謝@ Rory-McCrossan的理念。我想用php正則表達式來做，如果我沒有得到那個。 – Maqk

沒問題，很樂意幫忙。如果你有可能在PHP中這樣做，我會在那裏做，因爲它會避免任何FOUC的可能性。正則表達式本身應該是一樣的，只有它的實現纔會改變。 –

使用CSS或jQuery在HTML中使用標題單獨匹配字符串

回答

相關問題