project-simple-red-dom v1.0.1

RedDom

Simple Dom maker

github - here

Install

npm

npm install project-simple-red-dom --save-dev

import RedDom from 'project-simple-red-dom';

browser

<script src="https://project-simple.github.io/RedDom/dist/RedDom.min.js"></script>
<script>
RedDom('div').S(
    'background','red',
    'html','hello RedDom',
     '<','body'
);
</script>

API

RedDom( target string or element )

• 4 ways to create a RedDom Instance

• by id

<div id="test-id"></div>

RedDom('#test-id'); // return RedDomCls instance

• by tag name

RedDom('div'); // create div element and return RedDomCls instance

• by html string

RedDom('<div style="color:red">test<div>'); // create html element and return RedDomCls instance

• by element

RedDom(document.createElement('div')); // return RedDomCls instance
RedDom(document.querySelector('#test-id')); // return RedDomCls instance

Set Dom Attribute

• RedDom('input').S('@attributeName','targetValue');

RedDom('input').S( '@value','this is value' );

equal

<input value="this is value"></input>

Get Dom Attribute

• RedDom('input').S('@attributeName');

var t0 = RedDom('input').S( '@value','this is value' );
console.log(t0.S('@value')) // this is value

Set Dom style

• RedDom('div').S('style name','targetValue');

RedDom('div').S( 'background','red' );

equal

<div style="background:red"></div>

Get Dom style

• RedDom('input').S('style name');

var t0 = RedDom('div').S( 'background','red' );
console.log(t0.S('background')) // red

TestCase

• MochaTest : here
• TestBDD : here
• Test Dom Events : here
• Test Simple Container Method : here