Style

width()

// Getter
width(): number;

Return element's offsetWidth . Normally , offsetWidth = padding + content + border .

Example

const width1 = document.querySelector('p').offsetWidth;
const width2 = nashi('p').width();
console.log(width1 == width2); // true

height()

// Getter
height(): number;

Return element's offsetHeight . Normally , offsetHeight = padding + content + border .

Example

const height1 = document.querySelector('p').offsetHeight;
const height2 = nashi('p').height();
console.log(height1 == height2); // true

innerWidth()

// Getter
width(): number;

Return element's clientWidth . Normally , clientWidth = padding + content .

Example

const width1 = document.querySelector('p').clientWidth;
const width2 = nashi('p').innerWidth();
console.log(width1 == width2); // true

innerHeight()

// Getter
height(): number;

Return element's clientHeight . Normally , clientHeight = padding + content .

Example

const height1 = document.querySelector('p').clientHeight;
const height2 = nashi('p').innerHeight();
console.log(height1 == height2); // true

css()

// Getter
css(key: string): string;
// Setter
css(key: string, value: string): QueryResult;

Get or set style.

Example

const para = nashi('p');
para.text('nashi is perfect!')
    .css('backgroundColor', 'skyblue')
    .css('font-size', '25px');

console.log(para.css('background-color')); // skyblue
console.log(para.css('fontSize')); // 25px

style()

// Getter
style(key: string): string;
// Setter
style(key: string, value: string): QueryResult;

Get or set styles.

Example

const para = nashi('p');
para.text('nashi is perfect!')
    .style('backgroundColor', 'skyblue')
    .style('font-size', '25px');

console.log(para.style('background-color')); // skyblue
console.log(para.style('fontSize')); // 25px
Last Updated:
Contributors: AkaraChen