GASでのhtmlメール 二つの表を送信

Question

gasでスプレッドシートのデータ取得して、html形式のメールを送信します。
表を二つ送信したいのですが、表が二つくっついてしまいます。
tbl& newtd&newtd2がくっついた形です。tbl2のデータは見当たりません。

function myFunction() {

  //値取得、二次元配列格納
  let sheet1 = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("テスト");
  let sheet2 = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("データ");

const range3 = sheet2.getRange(3,1,9,6);
const range4 = sheet2.getRange(6,9,3,2);

console.log("hani:"+range3.getValues());
console.log("hani2:"+range4.getValues());

  let vals = range3.getValues();
  let vals2 = range4.getValues();

let tbl = "<table border='1' style='border-collapse: collapse;'><tr><th>タイムスタンプ</th><th>毎日送信テスト</th><th>テスト</th><th>A</th><th>B</th><th>C";

//ここでは最後</table>でしめません。forでtrを追加して、一番最後に<table>を追加します。

  let newtd ="";

  vals.forEach(x=>{    //二次元配列valsから一つずつ配列取り出し
    for(let elnum in x){    //取り出した一次元配列から一つずつ要素取り出し
      newtd += "<td>"+x[elnum]+"</td>";
    } 
    let tr = "<tr>"+newtd+"</tr>"
    tbl += tr; tr
    newtd="";
  })
// let mailText =tbl +"</table>"//ここでtableを閉じます。


let tbl2 = "<table border='1' style='border-collapse:collapase;<tr><tr>物</th><th>合計";
 let newtd2 ="";
    vals2.forEach(x=>{    //二次元配列valsから一つずつ配列取り出し
    for(let elnum in x){    //取り出した一次元配列から一つずつ要素取り出し
      newtd2 += "<td>"+x[elnum]+"</td>";
    } 
    let tr = "<tr>"+newtd2+"</tr>"
    tbl += tr; tr
    newtd2="";
  })

let mailText = tbl +"<br><br><br><br></table>" + tbl2 + "</table>"

  // //オプションでHTMLメール本文を設定する

  let options = {"htmlBody":mailText,};
  // let options = {"htmlBody":mailText + mailText2,};

  //GmailApp.sendEmail(メールアドレス,メール表題,本文（htmlメール送信できないとき表示）,htmlメールを設定（{htmlBody：html本文})
  GmailApp.sendEmail("****@****","①テスト送信", mailText , options);

Answer 1

実際に実行している関数が質問文通りのソースであるなら、

let tbl2 = "<table border='1' style='border-collapse:collapase;<tr><tr>物</th><th>合計";

このtbl2に代入するtableタグの閉じ記号>が存在しないので、有効なtableタグの開始タグと見なされていません。
表が上の表とくっついているのはこれが原因なのでは。
また、その行のtr,thの対応も正しくないと思われるので、落ち着いてタグの閉じ忘れ等を確認しましょう。

メールを送信せずにmailtextをログに出力し、そのhtmlがブラウザで正常に表示されるか確認してみるのも良いかと思います。

Comments

[Susuwatari]

ありがとうございます。
tableタグの閉じ記号気づいていませんでした。
直しましたが、tblデータ(タイムスタンプからcまで）＆valsデータ(range3のデータ)＆vals2データ(range4のデータ)が一つとなり、最後にmailTextでtbl2を追加しているためか、その後にtbl2(物、合計)が追加される形になります。
理想像は、
tblデータ(タイムスタンプからcまで）＆valsデータ(range3のデータ)で一つ、
改行がいくつかあって、
tbl2(物、合計)＆vals2データ(range4のデータ)
なのですが。。。

[Susuwatari]

<tr><tr>物　が、<tr><th>物

let tbl2 = "<br><br><table border='1' style='border-collapse: collapse;'><tr><th>物</th><th>合計";
と、tbl2のtableタグの前にbrタグを入れれば良かったんですね！！

また、
newtd2="";前の
tbl += tr; tr
については、 tbl2+= tr; tr
とするべきでした。
ありがとうございました！！

[hope_mucci]

希望通りの形の表が出力できたようで何よりです。
今後も頑張ってください。

[Susuwatari]

GAS学習1ヶ月弱、htmlはかすり程度、java全く未経験でした。
その中で、ポイント押さえてガイドくださり、ありがとうございました！！