There has a been a lot of criticism of PHP over being a badly designed programming language. JavaScript seems quite a similar language with loose-typing and flexible array declarations/memory management, but is widely adopted by industry leaders such as Google. Google even has a JavaScript style guide. Many people think that PHP has a worse reputation than JavaScript. Carlos Ribeiro gave his analysis on a high level which doesn't touch the language syntax.Attributing JavaScript success to it being "the only language for the job" is unfair. JavaScript is hands down a much better language than P...

The pseudo-element6 in CSS is extremely useful, you can use it to create CSS triangles and lots of other elements without overuse many HTML elements. In the past, you cannot get the property value of pseudo-element in CSS using JavaScript. Now you can call a new method in JavaScript to get them easily.Assume you have below CSS codes:.element:before { content: 'NEW'; color: rgb(255, 0, 0);}To get the properties in .element:before, you can use below JavaScript method:var color = window.getComputedStyle( document.querySelector('.element'), ':before').getPropertyValue('color')You can put the pseud...

Today I come across a code snippet which uses JavaScript to check different mobile devices and then loads different CSS files accordingly. As we know that there are mobile devices with different screen sizes, it's always troublesome for web developers to develop cross browser and cross device compatible codes. Hope this one can help those who develop web apps on mobile devices.// Check whether it's a mobile device// wukong.name 20130716if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEri...

Finite state machine is a very useful design model, it can be used to simulate many events in the world.In short, finite state machine has three features:Number of states is finiteAt any moment, one object can only be in one stateIn some condition, it will transfer from one state to another stateIn JavaScript, finite state machine can be applied in many places. For example, one menu element on a webpage. When the mouse hovers on the menu, the menu will show up, while the mouse moves away, the menu will hide. If we use a state machine, there are two states(show and hide), the mouse will trigger...

In this post, we will share some less known but powerful JavaScript tips which can benefit both novice and veteran JavaScript developers.1. Truncate array with array lengthWe all know that object are passed by reference in JavaScript, but we may be bitten by this rule. Please check below example:var arr1 = arr2 = [1, 2, 3];//Change arr1arr1 = []; // arr2 will still be [1,2,3]arr1 and arr2 point to the same array [1,2,3] initially, later when arr1 repoints to [], the reference to arr2 is not changed, it will still point to [1,2,3]. But if we want both arr1 and arr2 point to [], what should we d...

Writing JavaScript code is tedious and error prone. You not only need to implement the necessary functions, but also need to ensure cross browser compatibility. This often causes the low efficiency of JavaScript developers. Here we recommend 12 tips you can benefit from.1. Remove array element by indexIf we want to remove one element in an array, we can use splice.function removeByIndex(arr, index) { arr.splice(index, 1);}test = new Array();test[0] = ’Apple’;test[1] = ’Ball’;test[2] = ’Cat’;test[3] = ’Dog’;alert(“Array before removing el...

To understand what value a variable has in JavaScript, we need to understand some concepts such as scope and name resolution order.JavaScript has two scopes; one is program level and the other one is function level. Unlike in C,C++ or Java, JavaScript has no block level scope. So a variable defined in a if block will still be available outside. For example, the below example:var foo = 1;function bar() { if (true) { var foo = 10; } alert(foo);}bar();The alert will display 10 since the variable foo defined in the if block can been seen by the alert() function.Next we need to understand the name...

1. Use DocumentFragment or innerHTML to replace complex elements insertionDOM operation on browser is expensive. Although browser performance is improved much, multiple DOM elements insertion is still expensive and will affect the page load speed.Assume we have an ul element on our page, we now want to retrieve a JSON list using AJAX and then update the ul using JavaScript. Usually we may write it as :var list = document.querySelector('ul'); ajaxResult.items.forEach(function(item) { // Create element var li = document.createElement('li'); li.innerHTML = item.text; // Manipulate ...