用通配符

Question

我使用jQuery，jQuery Mobile的，JS，HTML和CSS裏面的PhoneGap爲我的Android/iOS應用程序使用.load的一種方式。

我的JS &的jQuery的把握是相當有限的。

我的index.html使用.load將其他html文件調用到它們的同名div中。

有沒有辦法來取代下面的代碼：

$('#page01001').load('cards/01001.html'); 
$('#page01002').load('cards/01002.html'); 
$('#page01003').load('cards/01003.html'); 
$('#page01004').load('cards/01004.html'); 
.. 
$('#page01900').load('cards/01900.html'); 

（這會佔用近2000行我.js文件的），用一個單一的規則，會做這樣的事情：

$('#pageIDENTIFIER').load('cards/IDENTIFIER.html'); 

這樣任何名爲「pageWHATEVER」的div都會加載一個同名的html文件（減去單詞「page」）？

我讀過了jQuery的通配符，但不能找到一種方法，然後採取通配符輸入和命令的第二部分進行復制。

要稍微複雜，通常有index.html中那會引用相同的HTML文件的幾個地方：

$('#page01001').load('cards/01001.html');  
$('#pageX01001').load('cards/01001.html'); 
$('#pageH01001').load('cards/01001.html'); 

這樣的div 「page01001」， 「pageX01001」 & 「pageH01001」 需要所有.load 01001.html

而且，有很多是剛剛的div並且不需要任何.load div的所有。我不想影響這些。只有名稱以「page ..」開頭的div需要.load。

有沒有一種方法可以改善這一點？

Answer 1

使用.each()環，和一個正則表達式中提取從ID的頁號。

$("div[id^=page]").each(function() { 
    var match = this.id.match(/\d+$/)[0]; 
    $(this).load('cards/' + match + '.html'); 
});