jQuery селектор :lang

Определение и применение

Селектор :lang(language) выбирает элементы с указанным языком, в том числе унаследованным от предка. Например, :lang(en) соответствует lang="en" и lang="en-US", а также их потомкам без собственного языка.

jQuery синтаксис:

$(":lang(language)")

Добавлен в версии jQuery

Селектор в CSS

Пример использования

Селектор :lang — пример 1

Нажмите ▶. Измените JavaScript и запустите пример повторно. Используется jQuery 4.0.0.

index.html

HTML

<p lang="es">¿Por qué necesita una traducción?</p>
<!-- Этот параграф интерпретируется как испанский -->
<p lang="ru">Интерпретация языка на русском.</p>

main.js

JavaScript

$(document).ready(function () {
    $('p:lang(es)').css('color', 'yellow') // устанавливаем цвет для абзаца на испанском
    $('p:lang(ru)').css('color', 'red') // устанавливаем цвет для абзаца на русском
})

style.css

CSS

body {
  margin: 16px;
  font:
    16px/1.5 system-ui,
    sans-serif;
  overflow-wrap: anywhere;
}
img,
input,
select,
textarea,
button {
  max-width: 100%;
}

В этом примере с использованием jQuery селектора :lang() мы стилизовали абзацы в зависимости от значения глобального атрибута lang. В первом абзаце указан код языка - испанский, а во втором - русский язык.