xembler v1.3.0

Xembly engine for JavaScript.

Make sure you understand what is Xembly and what does directives mean before using this library.

Usage

Xembler class can apply directives to DOM using raw string directives: new Xembler('ADD span;SET hello'), or helper objects: new Xembler(new Directives().add('span').set('hello')) and apply to to DOM elements:

var div = document.getElementById('content');
// add span with 'hello' text to `div`
new Xembler(new Directives().add('span').set('hello'))
  .apply(document, div);

More complex example creates new HTML form with input fields:

var div = document.getElementById('content');
new Xembler(
  new Directives()
    .xpath('form[@id = "login-form"]') // move cursor to login form
    .push().xpath('input').remove().pop() // remove existing inputs
    .add('label').attr('for', 'login').set('Username').up() // add label for username
    .add('input').attr('type', 'text').attr('name', 'username').up() // add username input
    .add('label').attr('for', 'password').set('Password')
    .add('input').attr('type', 'password').attr('name', 'password').up()
    .add('input').attr('type', 'submit').attr('value', 'Sign in').up()
).apply(document)

Contributing

• npm is used for dependency management (see package.json for config)
• webpack is used for packaging (see webpack.config.js for main config and webpack-test.config.js for test config)
• eslint is enforced by CI tools (see .eslintrc.yml for config)
• mochajs is used for unit testing