本記事では、状態を表す属性が付与されているか確認する方法について解説しています。
JavaScriptの学習におすすめ書籍
1冊ですべて身につくJavaScript入門講座
メリット
- 誰でも分かるように嚙み砕いて説明してくれる
- アニメーションの知識が深く学べる
- 1つのWebサイトを作りながら学べる
ポチップ
先輩くんAmazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ！
後輩ちゃん初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね！
全プログラマー必見！
変数名/関数名にもう悩まない！
変数名/関数名にもう悩まない！
リーダブルコード
メリット
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
著:Dustin Boswell, 著:Trevor Foucher, 解説:須藤 功平, 翻訳:角 征典
¥2,640 （2023/07/23 02:48時点 | Amazon調べ）
ポチップ
目次
propメソッドの使い方
jQueryで状態を表す属性が付与されているか確認するには、propメソッドを使います。使い方は以下のとおりです。
$("セレクタ").prop("属性");| 引数 | 説明 |
|---|---|
| セレクタ | 属性を持っているか確認したい要素を指定 |
| 属性 | 確認したい属性を指定 |
状態を表す属性とは？
状態を表す属性とは、チェックボックスにチェックが入っている時に付与される「checked」や操作不可を表す「disabled」を意味します。この属性は主にフォームなどで使用されることが多いです。
先輩くんpropメソッドを使ったサンプルコードを用意したよ。
<label><input id="checkbox1" type="checkbox" name="test1" checked />チェック1</label>
<label><input id="checkbox2" type="checkbox" name="test2" />チェック1</label>$(function () {
let isChecked1 = $("#checkbox1").prop("checked");
let isChecked2 = $("#checkbox2").prop("checked");
console.log(isChecked1); // => true
console.log(isChecked2); // => false
});checked属性を持っているものと持っていない2つのチェックボックスを用意して、それぞれpropメソッドで確認しています。戻り値は指定した属性を持っていればtrueを返し、持っていなければfalseを返します。
