Mithril - 2.3 - Hyperscript - DOM attributes

In this example below you will see how to do a Mithril - 2.3 - Hyperscript - DOM attributes with some HTML / CSS and Javascript

This awesome code was written by MasqueradeCircus, you can see more from this user in the personal repository.
You can find the original code on
Copyright MasqueradeCircus ©


  • HTML
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

  <meta charset="UTF-8">
  <title>Mithril - 2.3 - Hyperscript - DOM attributes</title>
    <link rel="stylesheet" href="">

  <link rel='stylesheet prefetch' href=''>



  <script src=''></script>


    <script  src="js/index.js"></script>



/*Downloaded from */

m.render(document.body, m('article', [
 * Mithril uses both the Javascript API and the DOM API (setAttribute) to resolve attributes. 
 * This means you can use both syntaxes to refer to attributes.
m("input", { readonly: true, value: 'readonly' }), // lowercase
m("input", { readOnly: true, value: 'readOnly' }), // uppercase
m("input[readonly][value='readonly']"), m("input[readOnly][value='readOnly]"),

 * Mithril supports both strings and objects as valid style values. 
 * In other words, all of the following are supported:
m("label", { style: "background:red;" }, 'Red'), m("label", { style: { background: "red" } }, 'Red'), m("label[style=background:red]", 'Red')]));