質問: ECサイト作成してまして、品切れ中の時に明確にするため、 下記ソースにjavascript等でclass要素に追加したいのですが、 どう記述すればよいか教えていただけますでしょうか? ---------ここから-------- ←次の行に(品切れ中)と文言がある場合、ここにクラスを追加したい アイテム1(品切れ中) アイテム2 ---------ここまで--------
回答: こんな感じでしょうか。 ``` ``` require がクラスに入っている LABEL 要素を探して、その中に「品切れ中」の文字があった場合に、soldout というクラスを LABEL に追加しています。 jsFiddle で試してみたのがこちら。 追記です。 > input 属性に disabled (無効) を追加して、かつ checked(選択済の場合) が入っていたら削除したいのですが、、可能でしょうか? > > こんな感じ。 ``` window.addEventListener("DOMContentLoaded", function() { Array.prototype.forEach.call(document.querySelectorAll("label.required"), function(label) { if (/品切れ中/.test(label.textContent)) { label.classList.add("soldout"); let chk = label.querySelector('input[type="radio"]'); if (chk) { chk.disabled = true; chk.checked = false; } } }) }) ``` jsFiddle のコードも変更してみました。