用大寫替換href中的小寫字符

Question

我有一個為關鍵字生成鏈接的 web 頁面。 鏈接在 web 頁面上生成，如下所示：

https://www.example.com/?keywords=energy
https://www.example.com/?keywords=wind%20power

我想更改它，以便=之后的第一個字符（以及適用時的%20 ）為大寫：

https://www.example.com/?keywords=Energy
https://www.example.com/?keywords=Wind%20Power

目前，我一直在按關鍵字將它們更改為大寫：

$(document).ready(function(){
    $('a').each(function(){
        this.href = this.href.replace('energy', 'Energy');
    });

    $('a').each(function(){
        this.href = this.href.replace('wind%20power', 'Wind%20Power');
    });
});

有沒有辦法做到這一點，但有任何字符串？ 我已經嘗試了幾個正則表達式，但似乎找不到使用 javascript 將等號后的第一個字符替換為大寫等效項的正則表達式。 例如，我嘗試了這個（ https://regex101.com/r/ybQbaE/1/ ），然后嘗試將其轉儲到頁面上的腳本中：

`$(document).ready(function(){
    $('a').each(function(){
        this.href = this.href.replace(\=.,\U$0);
    });
});`

當然它不起作用，因為它適用於 PHP，但是當我在正則表達式測試器上單擊 ECMAscript Flavor 時，它只是將等號和后面的第一個字符替換為\U$0 。

Answer 1

如果這些是你唯一的情況，你可以用一個簡單的襯里解決它：

url="https://www.example.com/?keywords=wind%20power%20earth%20fire"
url.replace(/(=\w)|(\s\w)|(%20\w)/g,val=>val.toUpperCase())

有關正則表達式模式的更多信息，請訪問此。 有關 javascript 替換 function 的更多信息，請訪問替換 MSDN 文檔

Answer 2

您可以匹配一個= ，然后使用另一個替換器 function 在其中將連續的字母字符替換為其大寫版本：

$('a').each(function(){
    this.href = this.href.replace(
        /=(.+)/g,
        (_, keywords) => '=' + keywords.replace(
            /([a-z])([a-z]*)/gi,
            (_, initial, rest) => initial.toUpperCase() + rest.toLowerCase()
        )
    );
});

 $('a').each(function(){ this.href = this.href.replace( /=(.+)/g, (_, keywords) => '=' + keywords.replace( /([az])([az]*)/gi, (_, initial, rest) => initial.toUpperCase() + rest.toLowerCase() ) ); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <a href="https://www.example.com/?keywords=energy">a</a> <a href="https://www.example.com/?keywords=wind%20power">a</a>

Answer 3

無需花哨，使用URL()構造函數！

 let url = new URL("https://www.example.com/?keywords=wind%20power%20earth%20fire"); let params = url.searchParams.get('keywords') console.log(params) params.split(" ").forEach( (e) => { console.log( e[0].toUpperCase() + e.substring(1) ) } )

Answer 4

當沒有特定的編碼器/解碼器可以提供幫助時，通常正則表達式應該是最后一步。 （就像在這種情況下， decodeURIComponent或URL構造函數）

document.querySelectorAll('a').forEach(a=>{
    var url = new URL(a.href);
    var keywords = url.searchParams.get('keywords')
    if( keywords ){
      //Capitalize thanks to: https://stackoverflow.com/a/7592235/1683017
      keywords = keywords.replace(/(?:^|\s|["'([{])+\S/g, m => m.toUpperCase())
      url.searchParams.set('keywords', keywords )
      a.href = url.href;
    }
})

Answer 5

我認為這在概念上更簡單（無論如何對我來說）：

url.replace(/=.*/, k => k.replace(/[a-z]+/g, s => s.toUpperCase()))

Answer 6

如果要匹配 = 或 %20，您只需修改正則表達式以包含 %20 作為選項，確保設置了全局標志，然后將 function 傳遞給替換 function 以將部分大寫匹配的字符串。

 let url = "https://www.example.com/?keywords=wind%20power%20earth%20fire"; let regex = /(?<=\=|%20)(.)/g; url = url.replace(regex, function (match, capture) { return capture.toUpperCase(); }) console.log(url)