Today's Question:  What does your personal desk look like?        GIVE A SHOUT

SEARCH KEYWORD -- DOM

  Convert HTML to DOM elements using JavaScript

In some cases, one would want to convert a HTML string to the DOM elements so that JavaScript can handle them easily. This is frequently used when one get some data from third party APIs where the data is in HTML format. In JavaScript, there are a couple of ways one can use to convert HTML to DOM elements. DOMParser document.createElement DOMParser DOMParser can parse XML or HTML source stored in a string into a DOM Document. After the conversion, the normal JavaScript call of h...

   JAVASCRIPT,DOMPARSER,DOCUMENT.CREATEELEMENT,HTML,DOM     2017-08-18 22:51:46

  The first 30 tweets on Twitter

Six years ago, we didn't know what a tweet was. But now, there are 340 million tweets posted every day. Looking back, do you know what are the earliest tweets on Twitter when it was released? Let's check them out. Before that, let's check Twitter's background first. Six years ago, Twitter was called twttr (similar to Flickr), the earliest version was similar to an SMS broadcast service, i.e sending short message to friends to tell them what I am doing. It was put online on 22nd October, 2006, J...

   Twitter,history,story     2012-10-11 20:03:22

  Understand Virtual DOM

With the popularity of React, the internals and implementation of Virtual DOM has becoming top discussed topic in tech communities and interviews. This post will give an introduction of Virtual DOM and how to implement a simple Virtual DOM logic. How to understand Virtual DOM In early days, front end developers would update a webpage view based on the data status change(usually after making AJAX call). But it brings performance penalties when there is frequent update as it would cause page reflo...

   JAVASCRIPT,DOM,VIRTUAL DOM     2019-12-07 23:43:04

  Google open sources Leak Finder for JavaScript

Google recently open sourced a tools for finding memory leaks in JavaScript programs. In JavaScript you cannot have "memory leaks" in the traditional sense, but you can have objects which are unintentionally kept alive and which in turn keep alive other objects, e.g., large parts of DOM. Leak Finder for JavaScript works against the Developer tools remote inspecting protocol of Chrome, retrieves heap snapshots, and detects objects which are "memory leaks" according to a given leak definition. The...

   Google,Open source,JavaScript     2012-08-15 13:45:34

  How ScrollerJS works

ScrollerJS is a light weight number scroller module to be embedded in web apps. It provides fancy number scrolling animations. ScrollerJS supports both CSS transition and DOM animation to handle the animation needed. If CSS transition is supported in a browser, CSS transition will be the preferred option for animation. If in old browsers where CSS transition is not supported. DOM animation will be chosen automatically. How does the number scrolling actually work? To transition a number from 0 to...

   ScrollerJS,JavaScript,CSS,GitHub     2015-06-11 06:54:44

  How to be jQuery-free?

jQuery is now the most famous JavaScript library. There are around 57.3% websites in the world using jQuery, i.e, 6 out of 10 websites are using jQuery. If we only consider those websites which use libraries, then the percentage is even higher which is 91.7%. Although jQuery is very popular, its size is still a headache to many websites maintainers. The uncompressed jQuery 2.0 has a size of 235KB, the size is 81KB after optimization.The jQuery 1.8.3 which supports IE 6/7/8 has a uncompressed si...

   jQuery,JavaScript,ECMAScript,CSS3     2013-05-13 11:53:20

  Building the new AJAX mail UI part 2: Better than templates, building highly dynamic web pages

This is part 2 of a series of technical posts documenting some of the interesting work and technologies we’ve used to power the new interface (see also part 1, Instant notifications of new emails via eventsource/server-sent events). Regular users can skip these posts, but we hope technical users find them interesting. As dynamic websites constructed entirely on the client side become de rigueur, there are a number of templating languages battling it out to become the One True Wayâ„...

   Web design,Dynamic,Ajax,UI     2012-02-21 05:32:29

  Canonicalize XML in Java

XML canonicalization is often used when there is need to create digital signature to be sent to peers for verification. Since digital signature is created based on XML data, the XML data has to be canonicalized before its signature value can be calculated. Even an extra space may affect the signature value calculated, hence it must follow some rules to canonicalize the XML data so that it has a standard format. This is why W3C created specification Canonical XML Version 1.1. This specificat...

   JAVA,XML,JAVA SECURITY     2016-01-20 01:39:45

  Removing all child nodes from an element

When manipulating the DOM, it's often useful to remove all child nodes from a specific element. This typically comes in handy when you're looking to replace the content of an element with a separate form element, such as an <input>, so the user can edit the actual value.Here's an example of something I recently created that illustrates my point:Get the Flash Player to see this player.These "dynamic form elements" are written to the page only when the...

   Js,DOM,Remove all children,Clear,JavaScript,Code     2011-10-19 10:04:23

  Load and execute JavaScript

When we load and execute JavaScript in a webpage, there are many points we need to care about because of its design and feature. There are two features about JavaScript execution in a browser: 1). The JavaScript codes will be executed immediately once loaded;2). When JavaScript codes are being executed, they will block the following contents (including page rendering and other resources downloading). So if there are multiple js files to be loaded, these codes will be executed sequentially. Since...

   JavaScript,async,defer,load,execute     2013-06-07 04:53:46

RECENT