javascript - 根据数据属性选择 DOM 元素

Question

我有这样的 HTML 结构:

<span class="portfolio-custom-content" data-name="alexa" data-lang="hu">Hungarian text</span>
<span class="portfolio-custom-content" data-name="alexa" data-lang="en">English text</span>
<span class="portfolio-custom-content" data-name="peter" data-lang="hu">Hungarian text</span>
<span class="portfolio-custom-content" data-name="peter" data-lang="en">English text</span>
<span class="portfolio-custom-content" data-name="james" data-lang="hu">Hungarian text</span>
<span class="portfolio-custom-content" data-name="james" data-lang="en">English text</span>

我想根据 ID 和当前语言 (WPML) 选择文本。

这是我正在使用的 JavaScript 代码:

window.onhashchange = function () {
    var url = window.location.pathname,
        idk = [];

    // IDs for the current portfolio
    idk = {
        1: 'alexa',
        2: 'peter',
        3: 'james'
    }
    // Checking the current language of the website. If it's in english, german or italian, we need the english text, else we need the hungarian text.
    if (url.indexOf('/en/') > -1 || url.indexOf('/de/') > -1 || url.indexOf('/it/') > -1) {
        // not hungarian language
        var id = parseInt(window.location.hash.split("#")[1]),
            selector = '.portfolio-custom-content[data-name="' + idk[id] + '"]';

        if (!isNaN(id)) {


        }
    } else {
        // hungarian language
    }
}

正如您所看到的，我可以通过 id 选择正确的范围，但是我如何修改选择器，以便我可以选择名称和语言？

Answer 1

只需加倍选择属性即可:

selector = '.portfolio-custom-content[data-name="' + idk[id] + '"][data-lang="' + langVariable + '"]';