javascript - Javascript で作成されたチェックボックスがタグを正しく閉じない

Question

このようなチェックボックスを作成し、テーブル [TD] タグに追加すると:

var chkBx = document.createElement('input');
chkBx.type = 'checkbox';

td.appendChild(chkBx);

それは作成します

<tr>
    <td>
        <input type="checkbox" value="Current Issue">
    </td>
</tr>

この入力タグは適切に閉じられていません。これにより、コードの他の場所で問題が発生しています (たとえば、ホバーが機能しません)。

これを適切に閉じるために、Javascriptで何かする必要がありますか?

score 0 · Accepted Answer

CSS セレクターは何も選択していません。

.Table .Popup tr:hover {
    background-color:red;
}

次のようにする必要があります。

.Popup tr:hover {
    background-color:red;
}

と

.Table .Popup .PopupRow:hover {
    background-color:red;
}

する必要があります

table tr.PopupRow:hover {
    background-color:red;
}

また

table .PopupRow:hover {
    background-color:red;
}

これらは両方とも同じ要素を選択するため、より具体的なセレクター(2 番目のセレクター) が実際に使用されることになります。

最初のセレクターは、現在ホバーされている要素と、のクラスを持つ任意の要素の子孫であり、クラスがの任意の要素の子孫である要素に一致し.Table .Popup tr:hoverます。trPopupTable

2 番目のセレクターは、現在ホバーされているのクラスを持つ要素と、のクラスを持つの任意の要素の子孫であるのクラスを持つ任意の要素の子孫で.Table .Popup .PopupRow:hoverある要素と一致します。PopupRowPopupTable

フィドルのマークアップはその構造を反映していないため、セレクターによって一致するものはありません (そのため、スタイルが反映されません)。

score 0 · Accepted Answer

使用している DOCTYPE によって異なります。XHTML には終了タグが必要ですが、HTML には必要ありません。動的に作成された要素に終了タグが必要かどうかは、DOCTYPE によってブラウザーが自動的に判断すると思います。

jsfiddle のパーサーにも問題があるようです。マークアップは W3C バリデーターで正しく検証されますが、終了タグがないと機能しません。

2 に答える 2