Mithril - 2.3 - Hyperscript - DOM attributes

Tutorials of (Mithril - 2.3 - hyperscript - dom attributes) by Masquerade circus

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Mithril - 2.3 - Hyperscript - DOM attributes</title>
  
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">

  <link rel='stylesheet prefetch' href='https://masquerade-circus.github.io/pure-material-css/css/pure-material.css'>

  
  
</head>

<body>
  
  <script src='https://cdnjs.cloudflare.com/ajax/libs/mithril/1.0.0-rc.3/mithril.min.js'></script>

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

</body>
</html>
/* Downloaded from https://www.codeseek.co/ */
/* Downloaded from https://www.codeseek.co/ */
'use strict';

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')]));

This awesome code ( Mithril - 2.3 - Hyperscript - DOM attributes ) is write by Masquerade Circus, you can se more from this user in the personal repository

You can find the original code on Codepen.io

2018 © Masquerade Circus

More from Masquerade Circus

You Might Also Like