スマホからアクセス来た時だけtableを変更したい

質問

jqueryを利用して、スマホからアクセス来た時だけ、
tableタグの特定の列に<tr></tr>を追加したいのですが可能でしょうか？

やりたいことは下記のテーブルの,

<table>
<tr>
<td class="a">aaaaaaaa</td><td class="b">bbbbbbbbbb</td>
</tr>
<tr>
<td class="a">aaaaaaaa</td><td class="b">bbbbbbbbbb</td>
<tr>
</tr>
<td class="a">aaaaaaaa</td><td class="b">bbbbbbbbbb</td>
</tr>
</table>

td class="b"に<tr>タグを付加して、このようにしたいのですが、

<table>
<tr>
<td class="a">aaaaaaaa</td></tr><tr><td class="b">bbbbbbbbbb</td>
</tr>
<tr>
<td class="a">aaaaaaaa</td></tr><tr><td class="b">bbbbbbbbbb</td>
</tr>
<tr>
<td class="a">aaaaaaaa</td></tr><tr><td class="b">bbbbbbbbbb</td>
</tr>
</table>

可能でしょうか？

スマホの判別方法は、
$(function(){
// 480px以下の幅のブラウザでアクセスした時は
$(window).resize(function(){
var w =$(window).width();
var x = 481;
if (w < x){

これでOKでしょうか？

if文の続きが何を書いても上手く動いてくれません。

どうぞご教授よろしくお願いします。

回答No.1

babu_baboo · ベストアンサー

function hoge (table) {
　Array.prototype.forEach.call (
　　table.querySelectorAll ('tr'),
　　function (row) {
　　　Array.prototype.slice.call (row.querySelectorAll('td'), 0, -1).forEach (
　　　　function (td, i) {
　　　　　var tr = td.parentNode;
　　　　　var cn = tr.cloneNode (false);
　　　　　cn.appendChild (td);
　　　　　tr.parentNode.insertBefore (cn, tr);
　　　　 }
　　　 )
　　}
　)
}

hoge (document.querySelector('table'));
スマホでうごく？

お礼

babu_baboo様
ご連絡ありがとうございます。

お教え頂いたコードを貼り付けたところ、
無事動作致しました。

どうも、私が書いたif分のところが正常に動作しなかったようで、

$(function(){

var agent = navigator.userAgent;
if(agent.search(/iPhone/) != -1 || agent.search(/iPad/) != -1 || agent.search(/Android/) != -1){
//お教え頂いたコード
}
});
に変更したら、実機スマホでも無事動きました。

私が一生かかっても書けないコードをこんな短期間で。本当に助かりました。
ありがとうございました！