templateタグをjQueryで操作しようとしたらハマった話
jQueryを使ってtemplateタグをクローンしようとしたら中々にハマったのでメモ。
結論
一度HTML文字列として取得してからjQueryオブジェクトにする
var clone = $($('#productrow').html());
これはダメ
templateタグからは直接操作できなかった。。
var clone = $('#productrow *');
var clone = $('#productrow').children();
検証用メモ
HTMLはこちらを使用
https://naoqoo2.github.io/20180403-templateタグはクローンしてから使おう.md
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<script>
if ('content' in document.createElement('template')) {
var clone = $($('#productrow').html());
$('td', clone).eq(0).text('0384928528');
$('td', clone).eq(1).text('Acme Kidney Beans');
$('tbody').append(clone);
}
</script>