
M4Q
The m4q is a small library for DOM manipulation and animation and send/receive ajax requests.
About
The repository of m4q you can be found here.
Begin from 4.3.0
Metro 4 no longer depends on jquery
.
Now Metro 4
contains self own small library M4Q
(10kb in gzip) for DOM manipulation.
M4Q is not based on jquery code. M4Q library is built into Metro 4.
M4Q is not a complete jquery equivalent and there are differences.
Population
Main object has name m4q
. m4q may capture and relinquish $
with methods m4q.global()
and m4q.noConflict()
. Automatic capture $
if it free.
Further in the documentation $
will be used to specify the reference to the m4q object
.
Constructor
$( "div" )
- select bytag name
$( ".div" )
- select byclass name
$( "#div" )
- select byid
$( "<div>" )
- create bytag name
$( "<div>", context )
- create in context$( "<div>any_text_or_html</div>" )
- create byhtml
$( "<div>...</div><div>...</div>" )
- create bytags
$( "<div>", {...} )
- create by tag with attributes as object$( $(...) )
- create bym4q
as argument$( jQuery(...) )
- import from jQuery$( function(){} )
- Create document.ready function
Loops
$.each()
$(...).each()
Ajax
$.ajax({...})
$.get(url, data, options)
$.post(url, data, options)
$.put(url, data, options)
$.patch(url, data, options)
$.delete(url, data, options)
$.json(url, data, options)
$(...).load(url, data, options)
Visibility and effects
$(...).toggle()
$(...).hide()
$(...).show()
$(...).visible()
$(...).fadeIn( )
$(...).fadeOut( )
$(...).slideIn( )
$(...).slideOut ()
Animation
$.animate(...)
$(...).animate(...)
Contains functions
$(...).index()
$(...).get()
$(...).eq()
$(...).contains()
$(...).is()
$(...).find()
$(...).children()
$(...).parent()
$(...).closest()
$(...).siblings()
$(...).prev()
$(...).next()
$(...).filter()
$(...).last()
$(...).first()
$(...).ind()
$(...).even()
$(...).odd()
Attributes
$(...).attr()
$(...).attr(name)
$(...).attr(name, value)
$(...).attr({...})
$(...).removeAttr(name)
$(...).toggleAttr(name, value)
$(...).id(value)
$(...).prop()
$.meta(...)
$.doctype()
$.html()
Html, text and value
$(...).html()
$(...).html(value)
$(...).text()
$(...).text(value)
$(...).innerText()
$(...).innerText(value)
$(...).outerHTML()
$(...).empty()
$(...).val( )
$(...).val( value )
Css and classes
$(...).style()
$(...).style(name)
$(...).css(name)
$(...).css(name, value)
$(...).css({...})
$(...).addClass()
$(...).removeClass()
$(...).toggleClass()
$(...).hasClass()
$(...).clearClasses()
Position and size
$(...).height( )
$(...).height( val )
$(...).width( )
$(...).width( val )
$(...).outerHeight( )
$(...).outerHeight( val )
$(...).outerWidth( )
$(...).outerWidth( val )
$(...).offset( )
$(...).position( excludeMargin )
Manipulations
$(...).append( )
$(...).appendTo( )
$(...).prepend( )
$(...).prependTo( )
$(...).insertAfter( )
$(...).insertBefore( )
$(...).after( )
$(...).before( )
Data
$.hasData(el)
$.data(el, name, data)
$.removeData(el, name)
$(...).data()
$(...).data(key)
$(...).data(key, value)
$(...).removeData(key)
Events
$(...).on( )
$(...).one( )
$(...).off( )
$(...).fire( )
$(...).trigger( )
$(...).ready( )
$(...).blur( )
$(...).focus( )
$(...).resize( )
$(...).scroll( )
$(...).click( )
$(...).dblclick( )
$(...).mousedown( )
$(...).mouseup( )
$(...).mousemove( )
$(...).mouseover( )
$(...).mouseout( )
$(...).mouseenter( )
$(...).mouseleave( )
$(...).change( )
$(...).select( )
$(...).submit( )
$(...).keydown( )
$(...).keypress( )
$(...).keyup( )
$(...).contextmenu( )
Utils
$.merge(...)
$.type( ... )
$.camelCase( ... )
$.isPlainObject( ... )
$.isEmptyObject( ... )
$.isArrayLike( ... )
$.isSelector( ... )
$.isVisible( ... )
$.not( ... )
$.parseUnit( ... )
$.proxy( fn, context )
$.remove( selector )
$.sleep( ms )
$.fn.items( )
$.fn.clone( )
$.fn.merge(...)
$.setTimeout( ... )
$.clearTimeout( ... )
$.setInterval( ... )
$.clearInterval( ... )
Promise( ... )
setImmediate( ... )
clearImmediate( ... )