Question

关于如何提取<option>标签的值或标签本身的内容“内容在这里”，我找到了很多答案

但是，我想知道是否存在一种通过<option>text here</option>的文本值选择选项的方法-在这种情况下，使用text here作为匹配项。

我正在构建一个供内部使用的非常简单的表格-它将根据第一个下拉菜单的选择有效地限制第二个下拉菜单中的选项数量。但是，由于这是CMS的一部分，因此使用块的value属性并不是一项可靠的工作。我知道下拉列表的text参数的拼写和措辞很重要，这正是我所需要的。

我知道这不是一个好习惯-相信我，我知道。但是，现在这是我需要快速完成的工作，并且需要花很少的时间在此上。在不重新设计或重做这个已有十年历史的工具的所有逻辑的情况下，我会选择这种方式。

那么，是否可以按标记的内部文本进行过滤？我知道您可以提取它，但是我们要进行过滤，以便限制用户可以选择的选项。


    <select id="one">
        <option value="a">eh</option>
        <option value="b">bee</option>
    </select>

    <select id="two">
        <option value="m">emm</option>
        <option value="lw">lolwot</option>
        <option value="p">dinner</option>
    </select>

在这种情况下，如果他们从第一个下拉列表中选择'b'-它将在第二个下拉列表中将其选择限制为-only- lolwot-删除emm和dinner

仅重申一下，我不想从选定的选项中提取内容。 $('#two').find('option:selected').text()不是我想要的。

Answer 1

是的，有可能。假设您想保留一个带有lolwot内部文本的文本，可以执行以下操作：

[...document.getElementById("two").children].forEach((item) => {if (item.innerText !== "lolwot") item.remove()})

我们通过id及其子项在方括号内获取项目
我们将其转换为数组，所以我们有一个孩子数组
我们迭代此数组
如果当前项目不符合条件，我们只需将其删除

如果要删除这些项目，则可以过滤：

[...document.getElementById("two").children].filter((item) => (item.innerText !== "lolwot"))

如何通过选项标签的内容过滤/选择<选择>的<选项>？

1 个答案: