.. / JS vanilla. Пополняемое

  1. JavaScript

Навеяно текстом, опубликованным на web-standards.ru: Я знаю jQuery. И что?

Array. Отсюда


var arr = [ 1,2,3,4,5,6,7,8,9 ];
filter var newArr = arr.filter( function(item){ return item <5;} );
map newArr = myArray.map( function(item){ return item + 10; } );
forEach arr.forEach( function(item){ alert(item); } ); // наконец-то
every alert(arr.every( function(item){ return item > 0; } ) ); //true проверяет, все ли элементы удовлетворяют условию
some alert(arr.some( function(item){ return item > 0; } ) ); //true проверяет, существет ли элемент удовлетвор. условию

jQuery vs Vanilla. Отсюда

и отсюда: https://gist.github.com/liamcurry/2597326

jQuery JavaScript
$(document).ready(function() { // code… }); document.addEventListener("DOMContentLoaded", function() { // code… });
var divs = $("div"); var divs = document.querySelectorAll("div");
var newDiv = $("<div/>"); var newDiv = document.createElement("div");
newDiv.addClass("foo"); newDiv.classList.add("foo");
newDiv.toggleClass("foo"); newDiv.classList.toggle("foo");
$("a").click(function() { // code… }) [].forEach.call(document.querySelectorAll("a"), function(el) { el.addEventListener("click", function() { // code… }); });
$("body").append($("<p/>")); document.body.appendChild(document.createElement("p"));
$("img").filter(":first").attr("alt", "My image"); document.querySelector("img").setAttribute("alt", "My image");
var parent = $("#about").parent(); var parent = document.getElementById("about").parentNode;
var clonedElement = $("#about").clone(); var clonedElement = document.getElementById("about").cloneNode(true);
$("#wrap").empty(); var wrap = document.getElementById("wrap"); while(wrap.firstChild) wrap.removeChild(wrap.firstChild);
if($("#wrap").is(":empty")) if(!document.getElementById("wrap").hasChildNodes())
var nextElement = $("#wrap").next(); var nextElement = document.getElementById("wrap").nextSibling;
  1. 2013-12-23
  2. JavaScript
  1. blog.adtile.me/2014/01/16/a-dive-into-plain-javascript/ - И еще
  2. www.leebrimelow.com/native-methods-jquery/ - Native equivalents of jQuery functions
  3. frontender.info/native-methods-jquery/ - Нативные эквиваленты функций jQuery (перевод)
  4. frontender.info/the-classlist-api/ - classList API
  5. youmightnotneedjquery.com/ - YOU MIGHT NOT NEED JQUERY
Go Index Test