Как установить свойство содержимого псевдоэлемента `after` в атрибут элемента родственного элемента

Question

Есть ли способ, используя CSS, чтобы установить содержимое after псевдоэлемент к атрибуту элемента формы родного брата?

Например:

p:after{
  content: +select(attr(title));
}

<p>Message: </p>

<select>
  <option title="Hi" value="1">Hi</option>
  <option title="Hello" value="2" selected>Hello</option>
  <option title="Goodbye" value="3">Goodbye</option>
</select>

Желаемый результат вывода в этом примере будет: Message: Hello

Если это в настоящее время невозможно, есть ли какие-либо планы в спецификации CSS4 (или 5?), Чтобы разрешить использование селекторов в content имущество?

У меня есть решение jQuery, однако мне любопытно, можно ли это сделать без javascript?

Answer 1

attr() Функция может принимать атрибут только от исходного элемента, как на уровне CSS 2, так и на уровне CSS Values ​​уровня 3 (последний из которых даже еще не был реализован).

Работа над модулем уровня 4 еще не началась, но, учитывая введение модуля "Неэлементные селекторы", который в настоящее время включает селектор узла атрибута, было бы не слишком надуманным включить такую ​​функцию в уровень 4. attr() функция. Но, учитывая отсутствие интереса к реализации уровня 3 attr(), который подвергался риску в течение многих лет, я действительно не задерживал бы дыхание. Что является настоящим позором, потому что я тоже вижу большой потенциал в CSS attr() функция для авторов.

Answer 2

Хахаха LOL .. просто поделюсь, как это смешно..

$( 'p' ).after('<style></style>');
$( 'select' ).on( 'change', function(){
//$( 'p' ).text('Message: ' +$( 'select option:selected' ).text());
$( 'style' ).html('p:after{content: "'+$( 'select option:selected' ).text()+'" }');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p>Message: </p>

<select>
  <option title="Hi" value="1">Hi</option>
  <option title="Hello" value="2" selected>Hello</option>
  <option title="Goodbye" value="3">Goodbye</option>
</select>