Skip to content

Instantly share code, notes, and snippets.

Last active February 25, 2023 05:57
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?

Insert Script Tags into HTML

This function will insert the script tags into the <head></head>.

Scripts marked as defer are executed after the DOM parsing is complete in the order in which they are defined in the markup. If you need to load the scripts immidiately (after inserting), remove this line: script.defer = true.

However, you should be careful when placing your scripts into the <head></head> without async or defer.

function insertScript(src) {
    const script = document.createElement('script');
    script.src = src;
    script.async = false;
    script.defer = true;

addScript('1.js'); // 1. This script will start loading immediately.
addScript('2.js'); // 2. This script will be executed as soon as the first one is loaded.
addScript('3.js'); // 3. This is guaranteed to be in order 1 -> 2 -> 3.

Check if the Browser Is Internet Explorer

Fortunately, we don't need to do this anymore, the function is here for historical purposes.

function isIE() {
    const ua = navigator.userAgent.toLowerCase();
    return ua.indexOf('msie') !== -1;

Check if the Mobile Operating System

function getMobileOperatingSystem() {
    const ua = navigator.userAgent || navigator.vendor || window.opera;

    // Windows Phone must come first because its UA also contains "Android"
    if (/windows phone/i.test(ua)) {
        return "Windows Phone";

    if (/android/i.test(ua)) {
        return "Android";

    // iOS detection from:
    if (/iPad|iPhone|iPod/.test(ua) && !window.MSStream) {
        return "iOS";

    return "unknown";

Replace Cyrillic characters with Latin characters

function replaceCyrillic(str) {
    let output = str;

    const cyr = [

    const lat = [
    for (let j = 0; j < cyr.length; j++) {
        output = output.replace(cyr[j], lat[j]);
    return output;

console.log(replaceCyrillic('Тестовая строка')); // => 'Testovaya стrоkа'

Handle the Click Event on Dynamically Created Elements (jQuery)

In the example below, the .class element is a dynamically created element.

$('body').on('click', '.class', function() {
    // do something

Disabled Drag for Images and Links (jQuery)

The example below is deprecated, the function is here for historical purposes.

Nowadays, we can now use the CSS property user-drag: none;

function disableDrag() {
    $("img, a").on("dragstart", function(event) {

Fire a Callback When the Image Is Loaded (jQuery)

$('img').each(function() {
    const img = new Image();
    img.onload = function() {
        console.log($(this).attr('src') + ' - loaded!');
    img.src = $(this).attr('data-src'); // This can be used for lazy-loading

Force Viewport Width if Device Width Is Less Than N (jQuery)

function forceViewportSize() {
    var viewport = $('meta[name="viewport"]');
    if (screen.availWidth < 480) {
        viewport.attr("content", "width=320, user-scalable=no");
    } else {
        viewport.attr("content", "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no");

$(document).ready(function() {

$(window).on('resize', function() {

$(window).on("orientationchange", function() {
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment