在 Select 选项中获取 Span class 的值

Question

我知道它可能看起来是重复的，但事实并非如此。

这是我的 select 的样子：

<select id="avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0"> 
 <option value="1Ltr [ <span class=money>Rs.1,495.00</span> ]">...</option> 
</select>

我只想获得 class “钱”的价值。

这是我尝试过的：

var val = $('#avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0 option:selected').find('.money').val();

但这返回空值。

我怎样才能得到那个特定的价值？

Answer 1

我有点不清楚你想要返回什么，但这将返回 span 的textContent以及classNames 。 Span 元素没有值属性。

您可以使用DOMParser将选定的选项文本转换为 HTML 文档、select 文档中与该选择器匹配的元素，并提取textContent

 window.addEventListener("DOMContentLoaded", () => { const opt = document.querySelector('#avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0 option:checked'); const parser = new DOMParser(); //convert the value of the selected option to html document const htmldoc = parser.parseFromString(opt.value, "text/html"); //select all elements with className money from html document const moneys = htmldoc.querySelectorAll('.money'); //iterate each and display it's textContent moneys.forEach((a) => { console.log(a.textContent); //if you want to read the classNames a.classList.forEach((b) => { console.log(b); }); }); });

 <select id="avpMy4Y7E4cH_-iIRmmAK6-2GsEOu6Sjr-0-0"> <option selected value="1Ltr [ <span class=money>Rs.1,495.00</span> ]"></option> </select>