Javascriptを使用して、要素の:アクティブなCSS疑似クラスを有効にしますか?

これは可能ですか?

たとえば、ユーザーが「戻る」キーを押したときに「mousedown」イベントがトリガーされた場合、要素をアクティブなスタイルでレンダリングするにはどうすればよいですか?

私はクラスを使ってこれを行うことが可能であることを知っていますが、私は既存の:アクティブなスタイルを使うことを大いに好んでいます。

8
追加された
ビュー: 1
@ Casey - あなたがリンクを投稿したのと同じ質問ではないと思います。そのリンクでは、基本的に質問はjavascriptで擬似クラスを設定する方法でした。ここでEvanは、CSSですでに設定されている疑似クラスが実際にjavascriptイベントに基づいて実際にアクティブ化されていることを確認する方法を尋ねているようです。言い換えれば、彼は:active スタイルをあらかじめ設定しており、JavaScriptでイベントをトリガーしています。
追加された 著者 ScottS,
この質問は何度も聞かれました。 > stackoverflow.com/questions/311052 /…
追加された 著者 Casey Robinson,
ありがとう@Scott、あなたは正しい - JavaScript擬似クラスのスタイルをアクティブにできるかどうかを尋ねている。
追加された 著者 Evan Sharp,

1 答え

CSS 2.1仕様によると、:active疑似クラスがwhile :

要素がユーザーによってアクティブ化されています。たとえば、   ユーザーがマウスボタンを押して離した回数。

あなたはイベントターゲットとしてsubject要素を持つmousedownイベントを送出できなければならず、対応するmouseupイベントが送出されるまでアクティブでなければなりません。それがうまくいけば、十分なブラウザではそれを有効にするために信頼性の高い方法で動作しない可能性があります。

適切なクラスを追加/削除する方がはるかに簡単です(より広くサポートされます)。

編集

DOMActivateの使用例を次に示します。ある要素に対してactivateイベントをディスパッチすると、関連付けられたonactivateリスナが起動されますが、アクティブ化されている要素の外観は変更されません。

おそらく、activateイベントをリスンし、要素を強調表示するクラスを追加し、 setTimeout などを使用して数分後にそれを削除することで、アクチベーションをシミュレートできます。

<script type="text/javascript">
  function Init() {
    var p, ps = document.getElementsByTagName('p');
    var d = document.getElementById('div0');

    if (ps.length && ps[0].addEventListener) {

      for (var i=0, iLen=ps.length; i

  <div id="div0">div
    
para0
para1 <button onclick=" simulateActive('para0'); ">Activate para</button> </div> <button onclick=" simulateActive('para0'); ">Activate para</button> </body>
4
追加された
UIEventインターフェイスがあります。 DOMActivate 型を持っていますが、関連するUI動作をトリガしていないようです。だから簡単な答えは、スクリプトでは不可能と思われることです。
追加された 著者 RobG,
RobGに感謝します。残念ながら、mousedownイベントはCSSのアクティブなスタイルをトリガーしません(WebKitでのみテストされます)。これを行う簡単な方法はないようです。 : - /
追加された 著者 Evan Sharp,