如何在JavaScript中選擇html5範圍的僞元素

是否有可能用JS選擇<input type="range">僞元素？如何在JavaScript中選擇html5範圍的僞元素

我可以在我的css中設置像::-webkit-slider-runnable-track這樣的元素，但是如果我想在某個事件（如按鈕點擊或其他）後更改::-webkit-slider-runnable-track的background-color？

可能嗎？瀏覽器支持目前沒有意義。

UPD：問題是如何通過JS設計範圍的僞元素。假設我需要動態更改範圍的曲目顏色。我不能只用css來設計它。

我真正需要的是一樣的東西

document.getelementById('id').getPseudoElementSomehow('-webkit-slider-runnable-track').style = 'background: green'

來源

2016-04-04 Sergei Panfilov

看到此鏈接：https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ – AhbapAldirmaz

你想獲得與所有輸入通過JS鍵入然後在腳本中操作/與這些輸入交互，或者你是否想通過CSS選擇器來選擇它們？如果是後者，你究竟想要對元素進行風格化？ – Anthony

據我所知，你不能直接選擇用javascript僞元素。唯一的解決方案是在CSSStyleSheet.insertRule()的預期事件中添加css規則。

var button = document.querySelector('button'); 
 
button.onclick = function() { 
 
    document.styleSheets[0].insertRule('input[type=range]::-webkit-slider-runnable-track { background-color: red; }', 0); 
 
};

.red { 
 
    background-color: red; 
 
}

<input type="range"> 
 
<button>click me</button>

來源

2016-04-04 08:55:36 Lewis

更多技巧：https：//pankajparashar.com/posts/modify-pseudo-elements-css/ –

如何在JavaScript中選擇html5範圍的僞元素

回答

相關問題