I have a script in an HTML page of the following:
<script id="scriptid" type="text/html">
<div id="insidedivid">
... html code ...
</div>
</script>
I am able to get the HTMLScriptElement
using $("#scriptid")
but I am not able to get the underlying div object with the id "insidedivid"
. Whats the way to do it?
It's not possible; the browser does not treat HTML content inside of <script>
tags as part of the DOM. When you retrieve the content of the <script>
tag with $('#idhere').html()
, you're getting a string result.
To answer Troy's question, he's most likely including templates in the <head>
of his document so he can ultimately render content dynamically on the browser-side. However, if that is the case, the OP should use a different MIME type than text/html
. You should use an unknown MIME type such as text/templates
--using text/html
confuses what the purpose of the content is.
I'm guessing the reason you're trying to reach into the <script>
tag and grab a div
is because you've built smaller sub-templates within the single <script>
tag. Those smaller templates should rather be placed into their own <script></script>
tags rather than contained in one large <script></script>
tag pair.
So, instead of:
<script type="text/template" id="big_template">
<div id="sub_template_1">
<span>hello world 1!</span>
</div>
<div id="sub_template_2">
<span>hello world 2!</span>
</div>
</script>
Do this:
<script type="text/template" id="template_1">
<span>hello world 1!</span>
</script>
<script type="text/template" id="template_2">
<span>hello world 2!</span>
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With