Skip to main content
100%

$.loadTmpl

✓ Published0🌍 Public
Aabernier
Last edited Aug 13, 2011
Created on Aug 13, 2011

This example demonstrates a lightweight jQuery plugin that loads an external HTML template and injects it into the document head as a script tag with a custom type. It uses the jQuery `$.get` method to fetch the template content, then appends it using the `$("head").append()` API. The plugin assigns the template a user-specified id and type `text/template`, making it available for client-side rendering without executing the content. The code shows a simple, reusable pattern for loading templates dynamically, relying on jQuery’s AJAX and DOM manipulation functions.

AI-generated description

Similar vizzes

Loading thumbnail…

mon template de page web

This example demonstrates a minimal web page that loads jQuery and a custom script. The page displays a red background via the `styles.css` stylesheet, while `program.js` executes a simple `alert('Bonjour')` on load. The HTML structure includes a basic `<head>` and `<body>`, with no visible data visualization or interaction. The code uses the jQuery library (version 3.3.1) but does not call any specific visualization APIs.

Aabernier
63% match
Loading thumbnail…

Use systemjs/plugin-text to import html directly to $routeProvider or $templateCache, works great with jspm bundle.

This example shows how to load HTML templates as AngularJS module dependencies using SystemJS’s text plugin, avoiding separate HTTP requests. The code demonstrates three approaches: a directive’s `template` property, `$templateCache.put` for reuse, and `$routeProvider.when` for route-specific templates. Each snippet imports the template string via `import somethingHTML from './something.html!text'`, which SystemJS resolves at build time. The examples rely on AngularJS’s dependency injection and SystemJS’s bundle-friendly module loading, making templates directly available in the application’s JavaScript bundle.

HHypercubed
61% match
Loading thumbnail…

Inject a library from a cdn in any website through the console

This example demonstrates a browser console script that injects the jQuery library into any website from a content delivery network. The code creates a new `<script>` element, sets its type to `text/javascript`, assigns the jQuery CDN URL as the source, and appends it to the document’s `<head>`. The snippet relies on the DOM API `document.createElement` and `appendChild` to perform the injection. It shows a manual, console-based method for loading external JavaScript dependencies without a package manager or build step.

FFrozenfire92
58% match
Loading thumbnail…

Ttemplate

This example displays a large, bold greeting message centered on the screen, showcasing minimal styling with inline CSS. The page is built with plain HTML and uses no JavaScript libraries or data sources. It demonstrates a simple, text-only visualization with responsive font sizing and a clean, uncluttered layout. The code defines the entire presentation directly in the HTML file, making it easy to modify and reuse as a starter template.

MMinh Nguyen
58% match
Loading thumbnail…

Inject d3

This example demonstrates a live injection of a custom D3 build into a page, showing how the library can be loaded dynamically at runtime. It creates a new script element and sets its `src` to a remote D3 file hosted by the author, then appends that element to the document body. The visualization itself is not rendered in the code; instead, the focus is on the loading mechanism. The snippet uses the browser’s DOM API (`document.createElement`, `appendChild`) to fetch and execute the external script, making D3’s methods available for subsequent use. The source is a gist by 1wheel, and the loaded file appears to be a custom D3 build.

11wheel
58% match
Loading thumbnail…

Client-side Coffeescript with Jade and JQuery

This example demonstrates a minimal client-side CoffeeScript alert triggered on page load, showing how CoffeeScript can be embedded directly in a Jade template. The page loads jQuery and the CoffeeScript compiler from external sources, then uses the `:coffeescript` filter to compile and run `$(document).ready` in the browser. The code relies on the CoffeeScript runtime and jQuery’s DOM-ready event to display a “Hello World” message. No data or visualization is involved; the focus is on the integration of CoffeeScript, Jade, and jQuery.

AAnsonT
58% match
Loading thumbnail…

Gist 10297417

This example shows a Jupyter notebook template that hides input cells and reveals them on demand when a user clicks an output area, using jQuery to toggle visibility. The notebook’s rendered HTML is styled so code and text are centered, with hidden prompts and a custom font size for code blocks. The template extends the base HTML exporter and relies on jQuery’s `slideToggle` to animate the display of input sections, while CSS controls layout and typography. It demonstrates a reusable approach for converting notebook content into an interactive, cleanly formatted web page.

Aakeshavan
57% match
Loading thumbnail…

Gist 7232670

This example demonstrates how a single-page application skeleton is transformed from a static document into an interactive, AJAX-driven experience. The visualization shows a list of user-submitted code entries, with each entry dynamically loaded and rendered without a full page refresh. The implementation uses jQuery’s `$.ajax` method to fetch the `lucky_ajax.md` file and other resources, then updates the DOM with the retrieved content. The code also relies on JavaScript’s `Promise` API for handling asynchronous responses, and highlights the use of `XMLHttpRequest` for network communication. The data source is the downloaded application skeleton, whose structure is revealed through the fetched files. The example focuses on the interaction between client-side scripting and server responses.

EElaineYu
57% match