jQueryでの属性値の取得・設定・変更とJSでの記述方法

この動画では、Webフロントエンド開発におけるjQueryとJavaScriptでの属性値の取得、設定、変更方法について解説しています。

まず、HTML要素の属性値（属性: "attr"、英語：attribute）の取得から始まります。例えば、HTMLのAタグ（リンクタグ）について話されています。このAタグには、'href'という属性があります。

jQueryを使ってこの属性値を取得するには、まず目的の要素を特定します。ここでは、Aタグにクラス名'リンク'をつけてそれを特定します。次に、attrメソッドを使用して、取得したい属性（ここでは'href'）を指定します。

次に属性値の設定について説明されています。jQueryでは、attrメソッドの第二引数に設定したい値を指定することで、目的の属性値を設定できます。この方法は、属性値の変更にも同様に使用できます。

その後、JavaScript（バニラJS）を使った属性値の取得・設定・変更方法について解説されています。JavaScriptでは、要素を取得するためにquerySelectorを使います。

属性値の取得には、'getAttribute'メソッドを使用します。属性値の設定・変更には、'setAttribute'メソッドを使用します。第一引数に属性名、第二引数に設定したい値を指定します。

全体的に、jQueryとJavaScriptでの属性値の取得・設定・変更方法は非常に似ています。どちらの言語も、要素の特定、属性値の取得・設定・変更といった一連のフローを理解することが重要です。

なお、動画では主に'href'属性について解説されていますが、他の属性についても同様の手法を用いることが可能です。