README
OneBang
OneBang (aka 1!) turns html attributes starting with ! into an easy way to write code shorthand.
Installation
OneBang is available on NPM for browser and webpack consumption. (Recommended)
$ npm i --save onebang
OneBang is also available from Github.
CDNs are also available. (Not Recommended)
<!-- Latest Version -->
<script src="https://unpkg.com/onebang/dist/onebang.min.js"></script>
<!-- Specific Version (e.g. 1.0.2) -->
<script src="https://unpkg.com/onebang@1.0.2/dist/onebang.min.js"></script>
Read the docs here and check out the tests here.
Example
Before
<div !id:example>
<div !id:test !c:testclass !s:color:red>
<i !i:fa:code></i> Test
</div>
<a !#:test>Scroll</a>
</div>
After
<div id="example">
<div id="test" class="testclass" style="color:red;">
<i class="fa fa-code"></i> Test
</div>
<a href="#test">Scroll</a>
</div>
Usage
<script src="onebang.js"></script> <!--Automatically adds window.onebang-->
var settings = {};
onebang(/* optional settings */ settings); //This starts processing.
Processing happens automatically when the document's body is updated for most browsers.
DOCUMENTATION
Read the documentation to set up and get to know OneBang.