js獲取並改變偽元素的值

本文主要說一下::before::after，因為剩餘::first-letter、::first-line、::selection等沒有content屬性，方法是一樣的。

雖然偽元素可以被瀏覽器渲染引擎識別並正確渲染，然而偽元素本身並不是dom元素,所以無法被js直接操作——因此任何基於js直接選取dom元素的css更改方法對偽元素都不起作用。

js 裡面雖然沒有可以直接獲取操作為元素的選擇符，但是獲取css屬性是可以的。

方法：使用getcomputedstyle獲取當前元素所有最終使用的css屬性值，然後利用getpropertyvalue方法獲取對應的屬性的值。

var div = document.

getelementbyid
("test"),
style = window.
getcomputedstyle
(div ,
":after"
);

var div = document.

getelementbyid
("test"),
fontsize = window.
getcomputedstyle
(div ,
":after").
getpropertyvalue
('font-size');
;

自然想到的辦法：建立多個class，通過切換class來達到改變樣式的目的。但是這樣的方法太過繁瑣。實際上我們可以通過利用dom的data-*屬性來更改content的值。

html:

class

="my"
>
div>

css:

.my::before

.my

let my = document.

getelementsbyclassname
('my')[
0];settimeout((
)=>
,2000
);

Jquery 獲取 改變元素屬性值

via 標籤的屬性稱作元素屬性，在js裡對應的dom物件的對應屬性叫dom屬性。js裡的dom屬性名有時和原元素屬性名不同。操作元素屬性 返回元素指定屬性值 var txt1 val txt1 attr value 通過元素的dom屬性名更改dom屬性值 txt1 attr 通過指定元素屬性改變元素...

js事件繫結並獲取元素

dom事件繫結的幾種方式 html中直接繫結 利用html事件屬性。html中繫結事件叫做內聯繫結事件，不利於分離。不能解綁 js中直接繫結 利用dom操作。js中直接繫結稱為賦值繫結函式，缺點是只能繫結一次。解綁ele.nclick null addeventlistener 注意去掉on，通過r...

如何改變css偽元素的樣式

一 css偽元素 css 偽元素用於向某些選擇器設定特殊效果。偽元素的用法如下 selector pseudo elementcss 類也可以和偽元素搭配使用 selector.class pseudo element二 修改偽元素樣式 1.問題描述 偽元素例子 content content be...