{"id":33813,"date":"2023-02-14T09:33:53","date_gmt":"2023-02-14T04:03:53","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/"},"modified":"2023-02-14T09:33:53","modified_gmt":"2023-02-14T04:03:53","slug":"solved-write-a-js-script-in-a-div","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/","title":{"rendered":"[Solved] Write a js script in a div"},"content":{"rendered":"<p> [ad_1]<br \/>\n<\/p>\n<div id=\"answer-31129609\" class=\"answer js-answer accepted-answer js-accepted-answer\" data-answerid=\"31129609\" data-parentid=\"31085133\" data-score=\"12\" data-position-on-page=\"1\" data-highest-scored=\"1\" data-question-has-accepted-highest-score=\"1\" itemprop=\"acceptedAnswer\" itemscope itemtype=\"https:\/\/schema.org\/Answer\">\n<div class=\"post-layout\">\n<div class=\"votecell post-layout--left\"><\/div>\n<div class=\"answercell post-layout--right\">\n<div class=\"s-prose js-post-body\" itemprop=\"text\">\n<p>Don&#8217;t use <code>document.write<\/code>, <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Document\/write\">it does not do what you think it does<\/a>. What it <strong>does not do<\/strong> is write some data at the end of the document. What it does <em>instead<\/em>, is pipe data into the current write stream. And if there is no write stream, it will make a new one, resetting the document&#8217;s content. So calling document.write(dam) means you just wiped your document. <code>document.write<\/code> is a low level JS function from an earlier era of JavaScript, <strong>don&#8217;t use it<\/strong>.<\/p>\n<p>Instead, you want to use modern DOM manipulation functions, so in jQuery, that&#8217;s stuff like:<\/p>\n<pre><code>$(document.head).append($(\"&lt;script&gt;\").attr(\"src\", url));\n<\/code><\/pre>\n<p>where<\/p>\n<pre><code>$(\"&lt;script&gt;\")\n<\/code><\/pre>\n<p>builds a new script element,<\/p>\n<pre><code>$(...).attr(\"src\", url)\n<\/code><\/pre>\n<p>sets the &#8220;src&#8221; attribute to what you need it to be, and:<\/p>\n<pre><code>$(document.head).append(...)\n<\/code><\/pre>\n<p>or<\/p>\n<pre><code>$(document.body).append(...)\n<\/code><\/pre>\n<p>to get the script loaded into your document. If it&#8217;s a plain script with <code>src<\/code> attribute, it can basically go anywhere, and if it&#8217;s a script with text content that should run, you can only make that happen through <code>document.head<\/code>. <\/p>\n<p>Although if it&#8217;s <em>just<\/em> a script you need to load in and run, you can use <code>getScript<\/code>, but then you don&#8217;t need to do anything else, it&#8217;s just:<\/p>\n<pre><code>var url = \"https:\/\/code.jquery.com\/jquery-1.10.2.js\";\njQuery.getScript(url);\n<\/code><\/pre>\n<p>Done, jQuery will load the script and execute it. Nothing gets returned.<\/p>\n<p>Of course, the code you&#8217;re showing is loading jQuery, using jQuery, so that&#8217;s kind of super-odd. If you just want to load jQuery on your page, obviously you just use HTML:<\/p>\n<pre><code>&lt;!doctype html&gt;\n&lt;html&gt;\n  &lt;head&gt;\n    ...\n  &lt;\/head&gt;\n  &lt;body&gt;\n    ...\n    &lt;script src=\"http:\/\/https:\/\/code.jquery.com\/jquery-1.10.2.js\"&gt;&lt;\/script&gt;\n  &lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n<p>with the script load at the end so the script load doesn&#8217;t block your page. And then finally: why on earth are we loading jQuery version 1.x instead of 2.x? (if you need to support IE8: that&#8217;s not even supported by Microsoft anymore, so you probably don&#8217;t need to).<\/p>\n<p>And finally, if we don&#8217;t want to load the script, but we really just want its content, as plain text, there&#8217;s only a million answers on Stackoverflow already that tell you how to do that. With jQuery, that&#8217;s:<\/p>\n<pre><code>$.get(\"http:\/\/https:\/\/code.jquery.com\/jquery-1.10.2.js\", function(data) {\n  $(document.body).append($(\"div\").text(data));\n});\n<\/code><\/pre>\n<p>But you knew that already because that&#8217;s been asked countless times on Stackoverflow and you remembered to search the site as per the how to ask instructions before asking your question, right?<\/p>\n<\/p><\/div>\n<div class=\"mt24\"><\/div>\n<\/div>\n<p>            <span class=\"d-none\" itemprop=\"commentCount\">3<\/span> <\/p><\/div>\n<\/div>\n<p>[ad_2]<\/p>\n<p>solved Write a js script in a div <\/p>\n","protected":false},"excerpt":{"rendered":"<p>[ad_1] Don&#8217;t use document.write, it does not do what you think it does. What it does not do is write some data at the end of the document. What it does instead, is pipe data into the current write stream. And if there is no write stream, it will make a new one, resetting the &#8230; <a title=\"[Solved] Write a js script in a div\" class=\"read-more\" href=\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\" aria-label=\"More on [Solved] Write a js script in a div\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[320],"tags":[346,333,388],"class_list":["post-33813","post","type-post","status-publish","format-standard","hentry","category-solved","tag-html","tag-javascript","tag-jquery"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>[Solved] Write a js script in a div - JassWeb<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[Solved] Write a js script in a div - JassWeb\" \/>\n<meta property=\"og:description\" content=\"[ad_1] Don&#8217;t use document.write, it does not do what you think it does. What it does not do is write some data at the end of the document. What it does instead, is pipe data into the current write stream. And if there is no write stream, it will make a new one, resetting the ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\" \/>\n<meta property=\"og:site_name\" content=\"JassWeb\" \/>\n<meta property=\"article:published_time\" content=\"2023-02-14T04:03:53+00:00\" \/>\n<meta name=\"author\" content=\"Kirat\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirat\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\"},\"author\":{\"name\":\"Kirat\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\"},\"headline\":\"[Solved] Write a js script in a div\",\"datePublished\":\"2023-02-14T04:03:53+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\"},\"wordCount\":378,\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"keywords\":[\"html\",\"javascript\",\"jquery\"],\"articleSection\":[\"Solved\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\",\"url\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\",\"name\":\"[Solved] Write a js script in a div - JassWeb\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#website\"},\"datePublished\":\"2023-02-14T04:03:53+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jassweb.com\/solved\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[Solved] Write a js script in a div\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jassweb.com\/solved\/#website\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"name\":\"JassWeb\",\"description\":\"Build High-quality Websites\",\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jassweb.com\/solved\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\",\"name\":\"Jass Web\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"contentUrl\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"width\":693,\"height\":132,\"caption\":\"Jass Web\"},\"image\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\",\"name\":\"Kirat\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"contentUrl\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"caption\":\"Kirat\"},\"sameAs\":[\"http:\/\/jassweb.com\"],\"url\":\"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[Solved] Write a js script in a div - JassWeb","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/","og_locale":"en_US","og_type":"article","og_title":"[Solved] Write a js script in a div - JassWeb","og_description":"[ad_1] Don&#8217;t use document.write, it does not do what you think it does. What it does not do is write some data at the end of the document. What it does instead, is pipe data into the current write stream. And if there is no write stream, it will make a new one, resetting the ... Read more","og_url":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/","og_site_name":"JassWeb","article_published_time":"2023-02-14T04:03:53+00:00","author":"Kirat","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirat","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/#article","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/"},"author":{"name":"Kirat","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31"},"headline":"[Solved] Write a js script in a div","datePublished":"2023-02-14T04:03:53+00:00","mainEntityOfPage":{"@id":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/"},"wordCount":378,"publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"keywords":["html","javascript","jquery"],"articleSection":["Solved"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/","url":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/","name":"[Solved] Write a js script in a div - JassWeb","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/#website"},"datePublished":"2023-02-14T04:03:53+00:00","breadcrumb":{"@id":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jassweb.com\/solved\/solved-write-a-js-script-in-a-div\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jassweb.com\/solved\/"},{"@type":"ListItem","position":2,"name":"[Solved] Write a js script in a div"}]},{"@type":"WebSite","@id":"https:\/\/jassweb.com\/solved\/#website","url":"https:\/\/jassweb.com\/solved\/","name":"JassWeb","description":"Build High-quality Websites","publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jassweb.com\/solved\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jassweb.com\/solved\/#organization","name":"Jass Web","url":"https:\/\/jassweb.com\/solved\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/","url":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","contentUrl":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","width":693,"height":132,"caption":"Jass Web"},"image":{"@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31","name":"Kirat","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/","url":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","contentUrl":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","caption":"Kirat"},"sameAs":["http:\/\/jassweb.com"],"url":"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/"}]}},"_links":{"self":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/33813","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/comments?post=33813"}],"version-history":[{"count":0,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/33813\/revisions"}],"wp:attachment":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/media?parent=33813"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/categories?post=33813"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/tags?post=33813"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}