フロントエンドの共通スキル_html/css_WEB-ITnose

DOM ノードの取得:

• document.getElementById(): ドキュメントにのみ適用でき、見つかった要素ノードを返します。最も高速です。

• dom.getElementsByTagName(): すべての要素ノードに適用できます。上記は配列のようなコレクションを返します。

• dom.getElementsByClassName(): 上と同じ。

• dom.querySelector(): 最初に一致した要素とパラメータを返します。標準 CSS セレクターです。

• dom.querySelectorAll(): すべての要素ノードに適用でき、配列のようなパラメーターのコレクションを返します。パラメーターは標準 CSS セレクターです。

操作クラス

dom。 className: 要素のクラスを取得または設定します。
dom.classList: 要素のすべてのクラスのコレクションを返します。

• dom.classList.add(): 指定されたクラス名を追加します。
dom.classList.remove(): 指定されたクラス名を削除します。パラメータを渡さないと削除されません。
dom.classList.toggle(): 指定されたクラスがある場合、削除と追加の両方の関数があります。名前が存在しない場合は、追加します。
dom.classList.contains(): ノードに指定されたクラス名が含まれているかどうかを判断するためのブール値を返します。 WeChat かどうかを判断します;
document.referrer: ソースの URL を取得します;
Array.prototype.slice.call(list): 配列のようなコレクションを実数の配列に変換します;

• input.value: input の値を取得; input.defaultValue: input のデフォルト値を取得; の に value 属性がない場合、テキストの内容それ以外の場合は value 属性の値が取得されます。(すべて選択された を取得します)

  selectEl.options: 内のすべての タグを取得します。 collection;

selectEl.options.selectedIndex: 選択された ;
selectEl.options[selectEl.options.selectedIndex].textContent: 選択された のテキスト コンテンツを取得します。

• Regular
• *: 0 を複数回一致させる
  +: 1 を複数回一致させる
• ?: 0 または 1 回一致させる
  g: グローバル マッチング、つまり、1 つの一致だけを返すのではなく、次のように検索しますすべて一致し、通常は配列を返します
• i: 大文字と小文字を無視します
  m: 複数行の一致
HTML

• : IE ブラウザで最新のエンジンを使用してレンダリングします。chrome=1 で chrome Frame をアクティブ化できます。

• : IOS でキーボードの自動大文字化を無効にします;
• ある場合
  パッケージである場合は、それを開きます。ソフト キーボードの後は、「Go」と表示されます。それ以外の場合は、「Newline」と表示されます。要素、特に IOS の form 要素の場合、システム スタイルがデフォルトで適用されます
• -webkit-tap-highlight-color: rgba(0, 0, 0, 0): 後の背景色を無効にします。デフォルトでは、モバイルデバイスで押すと背景が灰色になります

-webkit-touch-callout:none;: ページを長押しするとポップアップ メニューが無効になります (iOS で有効)。 img タグと a タグの両方を追加する必要があります
background-size: 値が含まれている場合、幅と高さはコンテンツに適応します。値が cover の場合、幅と高さは背景を完全にカバーします。
-webkit-overflow-scrolling: touch: IOS のスクロール バーをより滑らかにします。