「未定義または NULL 参照のプロパティ 'innerHTML' は取得できません」エラー

JavaScript初心者です。
HTTP Requestを送信して、モバイルアプリにOnboardingするためのHTMLを書いています。
次のコードをChromeで実行すると、Device idが取得できるのですが、
IEとFirefoxで実行すると、エラーとなり取得できません。
IEでは「未定義または NULL 参照のプロパティ 'innerHTML' は取得できません」と表示され、実行がストップしてしまいます。FirefoxではTypeError:
xmlDocs.getElementByTagName(...)[0]
is undefined
というエラーが表示されます。

どうすればIEとFirefoxで実行してもDevice idを取得できるでしょうか。
よろしくお願いします。

lang
1<!DOCTYPE html>
2<html>
3<head>
4  <meta charset="UTF-8" />
5  <meta name="viewport" content="width=device-width, initial-scale=1" />
6  <title>Mobile App</title>
7  <link rel="stylesheet"
8    href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
9  <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
10  <script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js">
11  </script>
12</head>
13<body>
14  <div id="login" data-role="page">
15    <div data-role="header">
16      <h1>App Mobile Login v1</h1>
17    </div>
18    <div role="main" class="ui-content">
19      <div class="ui-field-contain">
20        <label for="svr">Server</label>
21        <input type="text" name="smp_svr" id="smp_svr" size="25" value="http://192.168.XXX.XXX:8080" data-clear-btn="true" data-clear-btn-text="clear" />
22      </div>
23      <div class="ui-field-contain">
24        <label for="svr">App Name</label>
25        <input type="text" name="smp_app" id="smp_app" size="25" value="com.app.sp07" data-clear-btn="true" data-clear-btn-text="clear" />
26      </div>
27      <div class="ui-field-contain">
28        <label for="svr">Entity Name</label>
29        <input type="text" name="smp_app" id="smp_ent" size="25" value="SVC_HEADSet" data-clear-btn="true" data-clear-btn-text="clear" />
30      </div>
31          <div class="ui-field-contain">
32        <label for="db">OS</label>
33        <select name="db"  id="smp_os">
34          <option value="Windows">Windows</option>
35          <option value="iOS">iOS</option>
36          <option value="Android">Android</option>
37        </select>
38      </div>
39          <div class="ui-field-contain">
40            <label></label>
41            <input type="button" id="smp_onboard" value="OnBoarding" data-corners="true"/>
42          </div>
43        <div class="ui-field-contain">
44        <label for="pwd">Device id</label>
45        <input type="text" name="smp_devid" id="smp_devid" size="20" value="" />
46        </div>
47    </div>
48    <div data-role="footer">
49      <h3>Copyright 2015, XXX Co. Ltd.</h3>
50    </div>
51  </div>
52<script>
53    $("#smp_onboard").click( function() {
54        var xhr = new XMLHttpRequest();
55        xhr.open("POST", $('#smp_svr').val() + "/odata/applications/latest/" + $('#smp_app').val() + "/Connections",true);
56        xhr.setRequestHeader("Content-Type", "application/json");
57        xhr.setRequestHeader("Authorization", "Basic " + btoa("tmc48" + ":" + "password"));
58        xhr.send('{"DeviceType":"' + $("#smp_os").val() + '"}');
59        xhr.onload = function(e){
60            var parser = new DOMParser();
61            var xmlDocs = parser.parseFromString(xhr.responseText, "application/xml");  
62            $('#smp_devid').val(xmlDocs.getElementsByTagName("ApplicationConnectionId")[0].innerHTML);
63        };
64    });
65</script>
66</body>
67</html>

行動規範の内容に同意します

回答1件

.innerHTMLではなく**.textContent**を使ってみてください。
IEの挙動が変わらなければブラウザによって分岐させる形で、以下を試してください。

html
1getElementsByTagName('ApplicationConnectionId')[0].textContent; //Firefox, Chrome...
2
3getElementsByTagName('ApplicationConnectionId')[0].innerText; //IE

投稿2015/07/22 05:44