Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

JavaScriptのfocus（）メソッドはどのように機能しますか？

focus（）

Javascript focus（） メソッドは、HTMLフォーム要素を強調表示するのに役立ちます。要素を現在のドキュメントのアクティブな要素として設定します。現在のドキュメントでは、フォーカス 1つの要素にのみ適用できます。フォーカスは、テキスト、ボタンなどのいずれかに適用できます。

構文

element.focus(options);

例

次の例では、最初に「 Tutorialspoint」というテキストが表示されます。 "はアンカータグ'a'にあり、これは'focus'と呼ばれるIDです。後で、DOMメソッドと focus（）を使用してidが呼び出される関数が宣言されます。 テキスト「Tutorialspoint」の色を赤に変更するメソッドが適用されます。ここでは、クリックイベントにボタンが使用されています。

<html>
<head>
<style>
   a:focus, a:active {
      color: red;
   }
</style>
</head>
<body>
<a href="https://www.tutorialspoint.com/" id="focus">Tutorialspoint</a>
<input type="button" value="getfocus" onclick="getfo()">
<script>
   function getfo() {
      document.getElementById("focus").focus();
   }
</script>
</body>
</html>

上記のコードを実行すると、次の画像が画面に表示されます。


JavaScriptのfocus（）メソッドはどのように機能しますか？


[フォーカスを取得]ボタンをクリックすると、次の出力が表示されます。

出力

JavaScriptのfocus（）メソッドはどのように機能しますか？


  1. getElementByIDはJavaScriptでどのように機能しますか？

    getElementById getElementById（） DOMメソッドです 指定された値のID属性を持つ要素を返すために使用されます。これは、 HTML DOMで最も一般的な方法の1つです。 ドキュメント上の要素を操作するたびに使用されます。このメソッドはnullを返します 指定されたIDを持つ要素が存在しない場合。 IDはページ内で一意である必要があります。ただし、指定されたIDを持つ要素が複数存在する場合は、JavaScriptコードの最後の要素を返します。 例-1 次の例では、内部テキストが「GetElementById」でIDが「element」の段落タグがあります。

  2. プロパティ、メソッドをJavaScriptコンストラクターに追加するにはどうすればよいですか？

    以下は、JavaScriptコンストラクターにプロパティメソッドを追加するためのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <sty