How to access plain text content retrieved via <script type="text/plain" src=...> in JavaScript?
Solution 1:
First of all, the textattribute of the HTMLScriptElement is the preferred method to access the text of an inline <script> element. DOM-Level-2 and HTML5: 4.11.1 both indicate that a script should have an attribute text which contains the scripts interior text:
The IDL attribute
textmust return a concatenation of the contents of all the Text nodes that are children of thescriptelement (ignoring any other nodes such as comments or elements), in tree order. On setting, it must act the same way as thetextContentIDL attribute.
Since the <script> element is empty (you specified an external source), text, textContent and innerHTML are empty. This is because the text attribute is only set in inline scripts:
If the script is inline and the script block's type is a text-based language:
The value of the
textIDL attribute at the time the element's "already started" flag was last set is the script source.
So it's not possible to include an external text/plain using this method.
See also:
-
W3C: HTML5: 4.11.1 The script element: text attribute and the example for the game map:
<script src="game-engine.js"></script> <!-- game engine isn't inline --> <script type="text/x-game-map"> <!-- but data needs to be inline --> ........U.........e o............A....e .....A.....AAA....e .A..AAA...AAAAA...e </script>
Solution 2:
Note that if this were supported, it would provide a huge security hole and a means of getting around cross-site scripting protections that protect json and other data. Essentially, my nasty web page (nasty.com, say) could access your private data that's protected by cookies by loading it using a script tag. e.g.
<script type="text/plain"
src="https://supersecure.com/youraccount/privatedocs/list"/>
Since the cookies for supersecure.com will automatically be sent with the request (as is the case when requesting any resources), the secure site just returns the data (e.g. the list of private docs) since it couldn't easily tell the request apart from one from an ajax request from its legitimate webpage. This hole doesn't exist with ajax, since the browser will simply prevent a page from nasty.com from making an ajax request to supersecure.com, thanks to the same origin policy.
Obviously, there's no security problem with inline data.
Solution 3:
After several days of researching the same question, I found several references to the following code:
<html>
<head>
<script type="text/javascript">
function init() {
var extText = window.frames.messageTxt.document.body.lastChild.lastChild.data;
extText = extText.replace(/[\r\n]/g, " ");
document.forms[0].nMessage.value = extText;
}
window.onload = init;
</script>
</head>
<body>
<iframe name="messageTxt" src="txtData.txt" style="display:none"></iframe>
<form>
<textarea name="nMessage"></textarea>
<input type="button" value="click" onClick="init()">
</form>
</body>
</html>
The above code does actually access the txtData.txt file (provided it exists) and dumps it into a <textarea> as the default text. For some reason, none of the above responses mention that this works, I assume because the question seems to imply the <src> tag specifically (for a similar technique may not be available; I have not checked); however, I still think it is worth mentioning supposing your query pretains to the more general question of obtaining an external .txt file (or if anyone else who comes across this page is seeking said question's anwser), mostly because it took me hours researching it, so I believe it plausible that the answer was simply hard to produce.