jQueryのindex()メソッドとinputのplaceholderを設定するスタイル

2052 ワード

一、index()方法小結
今日はショッピングカートの弾窓を作るときに問題にぶつかって、この要素が親級のいくつかの要素であることを判断する必要があります.具体的にどの商品かを判断する.また資料を見て、自分でまとめてみました.簡単に言えば、二つの使い方です.
  • 1、単一要素セレクタポイントindex()はパラメータを貫通せず、その要素が自分の同級要素の下付きの位置を返します.
  • 2、グループセレクタポイントindex()カッコ内でパラメータを伝達することは、パラメータが選択したこの要素が前のグループの下付き位置である.この要素が見つからない場合は-1を返します.単純コード例:htmlコード:
  •     
      1
    • 2
    • 3
    • 4

    jsコード:
        
            var a = $('#li').index();
            var b = $('.li').index('#li');
            var c = $('ul').index('#li');
            console.log(a,b,c);//1,0,-1
        
    

    二、input入力ボックスのplaceholder文字のスタイルを設定する
    placeholderはC 3に追加されたプレースホルダで、偽要素と見なすことができます.スタイルを設定するには、擬似要素で選択する必要があります.以下は互換性の書き方です.
      ::-webkit-input-placeholder { /* WebKit browsers */
    
      color:#999;
    
      }
    
      :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    
      color:#999;
    
      }
    
      ::-moz-placeholder { /* Mozilla Firefox 19+ */
    
      color:#999;
    
      }
    
      :-ms-input-placeholder { /* Internet Explorer 10+ */
    
      color:#999;
    
      }
    

    もちろん、偽類である以上、以下のような書き方を採用することもできます(上の略記形式は私たちを満たすことができるので、一般的には上の1枚を使えばいいです.以下は理解を助けるだけです):
      input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    
      color: #666;
    
      }
    
      input:-moz-placeholder, textarea:-moz-placeholder {
    
      color:#666;
    
      }
    
      input::-moz-placeholder, textarea::-moz-placeholder {
    
      color:#666;
    
      }
    
      input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    
      color:#666;
    
      }
    

    知識点:単一コロン(:)はCSS 3の疑似クラスに用いられ、二重コロン(:)はCSS 3の疑似要素に用いられる.
    css擬似クラス:いくつかのスタイルを追加することができます.例えば:hover、focusなど;
    css擬似要素:要素と見なすことができます.例えば、after、beforeなど
    擬似要素は、二重コロンと擬似要素名で構成されます.二重コロンは、擬似クラスと擬似要素を区別するために現在の仕様に導入されています.しかし、擬似クラスは既存のスタイルと互換性があり、ブラウザは古い擬似クラスを同時にサポートする必要があります.例えば、first-line、:first-letter、:before、:afterなどです.したがって,css 2以前に既に存在していた擬似要素の2つの書き方に対する役割は同じであるが,IEブラウザと互換性を持つためには単一コロンの書き方を用いる.