hbsquery
v0.0.6
Published
Manipulate html attributes in handlebars
Downloads
5
Maintainers
Readme
Installation
npm install hbsquery
API
load
import { load } from 'hbsquery';
const $ = load('{{#if valid}}<div>bar</div>{{/if}}');
$.template();
//=> {{#if valid}}<div>bar</div>{{/if}}
addClass
import { load } from 'hbsquery';
const code = '<div></div>';
const $ = load(code);
$('div').addClass('newClass');
$.template();
//=> <div class="newClass"></div>
removeClass
import { load } from 'hbsquery';
const code = '<div class="show {{layout}}-show"></div>';
const $ = load(code);
$('div').removeClass('show');
$.template();
//=> <div class="{{layout}}-show"></div>
hasClass
import { load } from 'hbsquery';
const code = '<div class="show {{layout}}-show"></div>';
const $ = load(code);
$('div').hasClass('show');
//=> true
attr
import { load } from 'hbsquery';
const code = '<div class="show {{cls}}"></div>';
const $ = load(code);
$('.show').attr('class').toString();
//=> 'show {{cls}}'
$('.show').attr('id', 'id');
$.template();
//=> <div id="id" class="show {{cls}}"></div>
$('.show').attr('id', null);
$.template();
//=> <div class="show {{cls}}"></div>
$('.show').attr({
id: 'id',
'data-type': 'button',
});
$.template();
//=> <div id="id" data-type="button" class="show {{cls}}"></div>
for loop
import { load } from 'hbsquery';
const code = '<div class="first"></div><div></div>';
const $ = load(code);
const $divs = $('div');
$divs.forEach((el) => {
const $el = $(el);
if ($el.hasClass('first')) {
$el.attr({ 'data-type': 'first' });
} else {
$el.attr({ 'data-type': 'normal' });
}
});
$.template();
//=> <div data-type="first" class="first"></div><div data-type="normal"></div>