HTML要素に指定された class 名や id 名などを取得する方法です。
私は今回、class名を取得するのに使いました。
使用するメソッドは「attr()」です。
サンプルコードはこちら。
// div要素のclass名を取得
var className = $("div").attr("class");
<div class="sample">DIV要素です</div>
上記を実行すると、変数 className には div要素のクラス名である「sample」が代入されます。
属性の取得についてはこんな感じです。
とても簡単でした！
また attr メソッドは、属性を取得するだけではなく、追加することもできます。
サンプルコードはこちら。
// div要素のid名にsampleと指定
$("div").attr("id", "sample");
<div>DIV要素です</div>
こちらを実行すると、div要素に id=”sample” が追加されます。
classの追加なら .addClass() メソッドもありますが、こちらの attr() メソッドは、属性名と値を指定できるので、class以外にも、id、href、type、value なんかも追加できます。
また、下記のように属性を一度に複数追加することもできるので、コードがすっきりして分かりやすいです。
$("div").attr({id : "sample",
class : "text"});
追加があるなら削除もできる、ということで、属性の削除には removeAttr() メソッドを使います。
// div要素のclass名を削除
$("div").removeAttr("class");
<div class="sample">DIV要素です</div>
上記を実行すると、class属性が削除されます。
このあたりはセットで覚えておくと良さそうですね。
ということて、要素に指定された属性の値を取得する方法でした！
class名に○○が指定された要素を取得、というのは使用したことがあるのですが、divに設定されたクラス名自体を取得する、というのはやったことがなかったので、今回調べてまとめてみました。
似たような箇所で悩んでいる方は、是非ご参考にしてください。
