概要
JavaScriptで擬似要素(:before、:after)を操作します。
取得
HTML
<div class="contentText">
テキスト
</div>
CSS
.contentText:before{
content: "コンテント";
}
JavaScript
let $text = document.querySelector('.contentText');
let before = window.getComputedStyle($text, '::before');
console.log(before.getPropertyValue('content'));
// コンテント
変更
JavaScript
let sheets = document.styleSheets
let sheet = sheets[sheets.length - 1];
//スタイルルールの追加
sheet.insertRule(
'.contentText::before { content: "コンテント2" }',
sheet.cssRules.length
);
コメントを投稿する