A thin jQuery wrapped around patrick-steele-idem/morphdom
npm install jquery-morphdomA jQuery wrapper for morphdom - a fast and lightweight DOM diffing/patching (without the virtual part)
> Lightweight module for morphing an existing DOM node tree to match a target DOM node tree. It's fast and works with the real DOM no virtual-DOM here!
If you need more information, check the morphdom repo.
This library can be used to instead of .html or .replaceWith, but keep in mind that this replaces the item itself, not just the inside contents. So it is much more like .replaceWith.
``js
// this is how .html works
$('#somediv').html("I will be inside #somediv");
// this is how .replaceWith and .morphdom work
$('#somediv').replaceWith("
$3
See the example.html for the full use case.
`js
jQuery(document).ready(function ($) {
// replace #div with #newid
$('#div').morphdom("New Text"); // replace the first li with the last one
$('ul').find('li').first().morphdom($('ul').find('li').last());
// replaces #fetched with the contents of partial.html
$.get('partial.html', function (data, textStatus, jqXHR) {
$('#fetched').find('.item').morphdom(data);
});
});
`$3
Please see this requirebin project.
$3
* loading form data via AJAX
* partial content, replacing other content
* AJAX pagination
* timeout changes to HTML
* updates to DOM for
input` events