引用的網(wǎng)站透過僅顯示符合使用者定義範(fàn)圍的價(jià)格來過濾價(jià)格,同時(shí)刪除任何不在價(jià)格範(fàn)圍內(nèi)的價(jià)格。您要求的篩選器僅突出顯示超過 20 的任何內(nèi)容。此外,第二個(gè)請(qǐng)求:
無法回答,因?yàn)槟形窗l(fā)布任何涉及任何其他過濾器的程式碼。
關(guān)於發(fā)布的程式碼,它不僅在語法上失敗,而且在目的上也失敗。
jQuery 方法無法辨識(shí)純 JavaScript 引用,反之亦然。為了在 jQuery 物件上使用純 JavaScript 方法, jQuery 物件必須取消引用。避免連結(jié) jQuery 和 JavaScript 方法。以下是問題中使用的 jQuery 方法表和純 JavaScript 方法表:
jQuery 方法
#方法 | 描述 |
---|---|
.each() |
迭代 jQuery 物件並為每個(gè) DOM 元素呼叫函數(shù) |
.find() |
收集 jQuery 物件中所有指定的 DOM 元素作為新的 jQuery 物件 |
.addClass() |
在 jQuery 物件中的每個(gè) DOM 元素中新增一個(gè)類別 |
純 JavaScript 方法
方法 | 描述 |
---|---|
.sort() |
按升序傳回給定陣列的新副本 |
.slice() |
將給定數(shù)組中定義的元素範(fàn)圍作為新數(shù)組傳回 |
簡(jiǎn)而言之,由div.mErEH _223RA
組成的jQuery物件是透過.each()
和.find()
創(chuàng)建的程式碼>.然後,當(dāng)在所述jQuery 物件上呼叫.sort()
時(shí),函數(shù)會(huì)失敗,因?yàn)椋?/p>
.sort()
是一個(gè)普通的 JavaScript 方法,無法辨識(shí) jQuery 物件.sort()
處理數(shù)組,而 jQuery 物件則不然如果函數(shù)完全放棄jQuery,只收集所有div.mErEH _223RA
作為NodeList,然後轉(zhuǎn)換為數(shù)組,.sort()
和.slice ()
可以工作。不幸的是,傳回的新數(shù)組由按升序排列的前 6 個(gè) DOM 元素組成,這甚至無法突出顯示超過 20 個(gè)的所有 DOM 元素。
在以下範(fàn)例中,實(shí)際的 HTML 佈局無關(guān)緊要,className ".x"
應(yīng)替換為 ".mErEH _223RA"
。
範(fàn)例中註解了詳細(xì)資訊
/** * For each ".x"... */ $(".x").each(function() { /** * ...get it's text with .textContent. * Then exclude the first character ("€") with .substring(1)... * ...and convert the text into a real number with Number(). */ let price = Number(this.textContent.substring(1)); /** * Next, if the number is greater than 20... */ if (price > 20) { /** * ...add ".red" className to DOM element. */ $(this).addClass("red"); } });
.red { color: red }
<main> <table> <tbody> <tr><td class="x">€20</td><td class="x">€100</td><td class="x">€10</td></tr> <tr><td class="x">€55</td><td class="x">€2</td><td class="x">€2000</td></tr> <tr><td class="x">€8</td><td class="x">€325</td><td class="x">€120</td></tr> <tr><td class="x">€70</td><td class="x">€99</td><td class="x">€220</td></tr> <tr><td class="x">€19</td><td class="x">€25</td><td class="x">€440</td></tr> <tr><td class="x">€111</td><td class="x">€44</td><td class="x">€13</td></tr> </tbody> </table> </main> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>