Gmail正文使用document.getElementById（“”）返回null

Question

我一直想打開Gmail撰寫郵件，並填充“收件人”，“主題”和“正文”。 一切順利，除了正文顯示為空。 有人可以看看這個，看看我出了什么問題嗎？ 下表/表格下方

function sendMail() {

var recipient = 'edb@ufec.com',
 subject = 'Typing Evaluation',
 message = document.getElementById('tStat');

window.open ('http://mail.google.com/mail/?view=cm&fs=1'+
            '&to=' + recipient +
            '&su=' + subject +
            '&body=' + message +
            '&ui=2');

和表格/表格，我得到的信息是從

<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td style="border-bottom: 2px solid #354562; padding: 4px" class="titlec">
<input disabled="" id="printB" onclick="sendMail(); return false" 
   type="button" value="Email Results" name="printB" 
   style="float: right; font-size: 8pt; font-family: Arial" />
<input type="button" value="New Test" onclick="location.reload(true);" />
    <center>United Fire Typing Evaulation System</center></td>
</tr>
</tbody>
</table>
</div>
<table border="0" cellpadding="0" 
       cellspacing="0" width="100%">
<tbody>
<tr>
<td style="border-bottom: 1px dotted #860E36; padding: 4px" 
 class="titlea" background="Images/Lt_Red_Back.gif" width="460">
 second time limit press the "End Test" button above. If you would like to re-evaluate,                     press the "New Test" button at the top of the page.</td>
 <td style="border-bottom: 1px dotted #860E36; padding: 4px" 
 class="titlea" background="Images/Lt_Red_Back.gif" width="190">
 <p align="right">v1.0</p>
 </td>
 </tr>
 <tr>
 <td style="padding: 4px" class="bodya" colspan="2">
 <form name="JobOp">
 <table border="0" cellpadding="5" width="100%">
 <tbody>
 <tr>
 <td>
 <table border="0" cellpadding="5" width="100%">
  <tbody>
  <tr>
   <td align="center" 
     style="border-left: 1px solid #344270; border-right: 2px solid #344270; 
            border-top: 1px solid #344270; border-bottom: 2px solid #344270; 
            padding: 5px; background-color: #CED3E8" 
     background="Images/Blue_Back.gif">
   <b><font face="Arial" size="2" color="#FFFFFF">Net / 
   Gross WPM</font></b></td>
   <td align="center" 
      style="border-left: 1px solid #344270; 
             border-right: 2px solid #344270; border-top: 1px solid #344270; 
             border-bottom: 2px solid #344270; padding: 5px; 
             background-color: #CED3E8" 
      background="Images/Blue_Back.gif">
   <b><font face="Arial" size="2" color="#FFFFFF">Entry 
   Errors</font></b></td>
   <td align="center" 
       style="border-left: 1px solid #344270; border-right: 2px solid #344270; 
              border-top: 1px solid #344270; border-bottom: 2px solid #344270; 
              padding: 5px; background-color: #CED3E8" 
       background="Images/Blue_Back.gif">
   <b><font face="Arial" size="2" color="#FFFFFF">Accuracy</font></b></td>
   <td align="center" 
      style="border-left: 1px solid #344270; border-right: 2px solid #344270;
             border-top: 1px solid #344270; border-bottom: 2px solid #344270;
             padding: 5px; background-color: #CED3E8" 
      background="Images/Blue_Back.gif">
   <b><font face="Arial" size="2" color="#FFFFFF">Elapsed 
   / Remaining</font></b></td>
  </tr>
  <tr>
   <td align="center"><font size="2" face="Arial">
   <div id="stat_wpm">
    Not Started</div>
   </font></td>
   <td style="border-left: 1px dotted #8794C7; border-right: 1px dotted #8794C7; 
              border-top-width: 1px; border-bottom-width: 1px" align="center">
   <font size="2" face="Arial">
   <div id="stat_errors">
    Waiting...</div>
   </font></td>
   <td style="border-left-width: 1px; border-right: 1px dotted #8794C7; 
              border-top-width: 1px; border-bottom-width: 1px" align="center">
   <font size="2" face="Arial">
   <div id="stat_score">
    Waiting...</div>
   </font></td>
   <td align="center"><font size="2" face="Arial">
   <div id="stat_timeleft">
    0:00</div>
   </font></td>
  </tr>
 </tbody>
 </table>
 </td>
</tr>
<tr>
 <td style="border-left-width: 1px; border-right-width: 1px; 
            border-top: 1px solid #344270; border-bottom-width: 1px">
 <div id="expectedArea" style="display:block">
  <p style="margin-top: 0; margin-bottom: 0">
  <font color="#7A88C0" face="Arial" size="1">
  <textarea name="given" cols="53" rows="10" 
    wrap="on" onfocus="deterCPProtect();" 
    style="width: 100%; border: 1px solid #344270; padding: 2px; 
           font-family:Arial; font-size:9pt">
    Click on the button below to start the typing test. 
    What you will be expected to type will appear here.
  </textarea></font>
  </p>
 </div>
 </td>
</tr>
<tr>
 <td>
 <p align="center" style="margin-top: 0; margin-bottom: 2px">
 <input type="button" 
    value="&gt;&gt; Start Typing Test &lt;&lt;" name="start" 
    onclick="beginTest()" 
    style="display:block; border-left:1px solid #293358; border-right:2px 
       solid #293358; border-top:1px solid #293358; border-bottom:2px solid #293358; 
       width: 100%; background-color: #9BB892; color:#FFFFFF; 
       background-image:url('Images/Green_Back.gif')" /></p>
 <p align="center" style="margin-top: 0; margin-bottom: 0">
 <input disabled="" type="button" 
   value="&gt;&gt; End Typing Test &lt;&lt;" 
   name="stop" onclick="endTest()" 
   style="display:none; border-left:1px solid #293358; border-right:2px 
            solid #293358; border-top:1px solid #293358; border-bottom:2px 
            solid #293358; width: 100%; background-color: #F05959; 
            color:#FFFFFF; background-image:url('Images/Red_Back.gif')" /></p>
 </td>
</tr>
<tr>
 <td style="font-family: Arial; font-size: 9pt">
 <div id="typeArea" style="display:block">
  <table border="0" width="100%" cellspacing="1">
   <tbody>
   <tr>
    <td style="border: 1px solid #9CA8D1; background-color: #EAECF4">
    <div align="left">
     <table id="stProg" border="0" 
                 width="0%" cellspacing="1">
      <tbody>
      <tr>
       <td style="border: 1px solid #344270; background-color: #8F9BCB; 
                   font-family:Arial; font-size:8pt; color:#FFFFFF"
                   align="right" background="Images/Blue_Back.gif">

          <div id="thisProg">0%</div>
       </td>
      </tr>
     </tbody>
     </table>
    </div>
    </td>
   </tr>
  </tbody>
  </table>
  <p style="margin-top: 0; margin-bottom: 0">
  <font color="#7A88C0" face="Arial" size="1">
  <textarea onkeypress="doCheck();" onkeydown="//calcStat()" 
     name="typed" cols="53" rows="10" wrap="on" 
     style="width: 100%; border: 1px solid #344270; padding: 2px; font-family:Arial; 
             font-size:9pt"></textarea></font>
  </p>
 </div>
 <div id="afterAction" style="display:none">
 </div>
 </td>
</tr>

Answer 1

您可能想要類似

document.getElementById('tStat').innerHTML
                                ^^^^^^^^^^

...否則，您引用的是元素，而不是其文本。 也就是說，我在HTML中看不到具有該id任何元素。

Answer 2

首先，我檢查了一下，您用於gmail的URL是正確的。

快速瀏覽后，您的消息變量將無法返回值。 您可以通過使用腳本並檢查gmail中的最終URL進行快速檢查（查看“ body”變量中是否包含任何內容）。

首先，您需要您的message變量來獲取正文textarea的值（或其中的任何html標簽，您的問題中都有很多html，快速掃描后我看不到哪個標簽包含了您的消息） 。 所以改變：

message = document.getElementById('tStat');

到

message = document.getElementById('tStat').innerHTML;

要么

message = document.getElementById('tStat').value;

取決於它所在的html標簽的類型。

我希望這有幫助。