It is a lightweight modern JavaScript library (4.1KB minified) intended for use on projects where legacy browser support is not necessary.

It uses mordern JavaScript (querySelectorAll, classList, matchesSelector) to help make it as lightweight as possible and therefore only works on the latest version of mordern browsers E.g. Chrome, Firefox, Opera, IE10+.

Simply download the minified version of svelte and reference it in your page.

<script src="svelte.min.js"></script>

You can also install svelte using bower:

bower install svelte	

If you have used other JavaScript libraries like Zepto or jQuery most functions will be familiar to you. For example, to set the text of an element, you would write:

$('.hello').text('Hello svelte');

• $(selector, context)
• each(callback)
• css(property, value)
• hide()
• show()
• toggle()
• addClass(className)
• removeClass(className)
• toggleClass(className)
• hasClass(className)
• on(name, callback)
• one(name, callback)
• off(name, callback)
• focus()
• blur()
• trigger(eventName, detail)
• next()
• first()
• last()
• parent()
• children()
• append(position, html)
• text(textToAdd)
• html(html)
• outerHTML(html)
• empty()
• clone()
• remove()
• attr(name, (value))
• removeAttr(name)
• val((value))
• length()
• height()
• width()
• position()
• matches(selector)
• closest(selector)

You can easily add a custom function to svelte by adding to $.fn.

$.fn.cool = function() {
	return this.each(function(el) {
    	el.textContent = 'Cool';
    });
}

$('.says-cool').cool();	

The svelte ajax function was removed in version 1.4.0. Instead it is recommended that you use the fetch api. There is a version of svelte bundled with a fetch and promises polyfill svelte.fetch.min.js.

fetch('/test.html')
.then(function(response) {
	return response.text()
}).then(function(body) {
	document.body.innerHTML = body
})

If you need to support IE9, you will need to use a pollyfill for ClassList like this one and put it somewhere before svelte is included on the page.

<!--[if IE 9]>
	<script src="js/classlist.js"></script>
<![endif]-->

Feel free to help make svelte better :-).