下記ソースにjavascript等でclass要素に追加したいのですが、
どう記述すればよいか教えていただけますでしょうか?
---------ここから--------
<div id="product_class">
<div class="radio">
<label class="required"> ←次の行に(品切れ中)と文言がある場合、ここにクラスを追加したい
<input type="radio" id="product_class_0" name="product_class" /> アイテム1(品切れ中)
</label>
</div>
<div class="radio">
<label class="required">
<input type="radio" id="product_class_1" name="product_class" /> アイテム2
</label>
</div>
</div>
---------ここまで--------
こんな感じでしょうか。
<script> window.addEventListener("DOMContentLoaded", function() { Array.prototype.forEach.call(document.querySelectorAll("label.required"), function(label) { if (/品切れ中/.test(label.textContent)) { label.classList.add("soldout"); } }); }); </script>
require がクラスに入っている LABEL 要素を探して、その中に「品切れ中」の文字があった場合に、soldout というクラスを LABEL に追加しています。
jsFiddle で試してみたのがこちら。
https://jsfiddle.net/pyn07v8y/
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 のコードも変更してみました。
https://jsfiddle.net/a_kuma3/pyn07v8y/1/
こんな感じでしょうか。
<script> window.addEventListener("DOMContentLoaded", function() { Array.prototype.forEach.call(document.querySelectorAll("label.required"), function(label) { if (/品切れ中/.test(label.textContent)) { label.classList.add("soldout"); } }); }); </script>
require がクラスに入っている LABEL 要素を探して、その中に「品切れ中」の文字があった場合に、soldout というクラスを LABEL に追加しています。
jsFiddle で試してみたのがこちら。
https://jsfiddle.net/pyn07v8y/
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 のコードも変更してみました。
https://jsfiddle.net/a_kuma3/pyn07v8y/1/
input 属性に disabled (無効) を追加して、かつ checked(選択済の場合) が入っていたら削除したいのですが、、可能でしょうか?
回答に追記しました。
有難うございます。思い通りになりました。
教えていただき助かりました。また機会あればよろしくお願いいたします。
回答に追記しました。
2017/07/26 21:11:08有難うございます。思い通りになりました。
2017/07/26 21:58:29教えていただき助かりました。また機会あればよろしくお願いいたします。