wiosna-dev/html-element

Simple PHP abstraction for HTML creation.

This package's canonical repository appears to be gone and the package has been frozen as a result.

v2.2.0 2017-02-17 09:38 UTC

Requires (Dev)

• friendsofphp/php-cs-fixer: ^2.0
• phpunit/phpunit: ^5.7

MIT

README

Simple PHP abstraction for HTML creation.

Please take a look at tests to see usage:

$a = (new HtmlElement("a"))
    ->setContent('Image: ')
    ->addElement(
        (new HtmlElement("img"))
            ->setIsSelfClosing(true)
            ->setAttribute("src", "i.png")
    );

echo (string) $a;

outputs:

<a>Image: <img src="i.png" /></a>

Functions List

new HtmlElement()

It is the only object in library. The only parameter is html tag.

$div = (new HtmlElement('div'));

If Object is projected on string object will produce its own Html and all of inner elements.

echo $div; will output:

<div></div>

->setTagName( string )

This method allows to change TagName of element after creating it.

$div = (new HtmlElement('div'));
$div->setTagName('p');

echo $div; will output:

<p></p>

->setAttribute( string, string )

Sets attribute for an element. It can be used to overwrite attribute value.

$div = (new HtmlElement('div'))->setAttribute('id', 'superDiv');

echo $div; will output:

<div id="superDiv"></div>

->setAtrributes( array )

Remove all the attributes of element and sets new ones from the given array.

$div = (new HtmlElement('div'))->setAttribute('id', 'superDiv');
$div->setAttributes([
    'class' => 'normalDiv notSoShiny',
    'style' => 'color: grey',
]);

echo $div; will output:

<div class="normalDiv notSoShiny" style="color: grey"></div>

->setIsSelfClosing( bool )

Sets selfClosing rule to element. Self closed element will not display inner elements of content.

$div = (new HtmlElement('div'))->setIsSelfClosing(true);

echo $div; will output:

<div />

->setContent( string )

Sets content to the element. It will be displayed as a string.

$div = (new HtmlElement('div'))->setContent('Hello');

echo $div; will output:

<div>Hello</div>

->addElement( HtmlElement )

Sets inner HtmlElement element. Inner elements will be displayed in the order of setting them. Inner elements will be displayed after content.

$span = (new HtmlElement('span'));
$div = (new HtmlElement('div'))
    ->addElement($span);

echo $div; will output:

<div>
    <span></span>
</div>

->setElements( array )

Remove all the inner elements of an element and set new ones from given array. Sets inner HtmlElement element. Inner elements will be displayed in the order of setting them. Inner elements will be displayed after content.

$span = (new HtmlElement('span'));
$div = (new HtmlElement('div'))
    ->setElements([
        $span,
        (new HtmlElement('p'))
    ]);

echo $div; will output:

<div>
    <span></span>
    <p></p>
</div>

->setIsTagHidden( bool )

By setting TagHidden to true, you can hide element Tag and Attributes displaying directly its Content and inner Elements. Thanks to this method you can use HtmlElement as container keeping list of inner Elements.

$div = new HtmlElement('div');

$div->setContent('Content:');
$div->addElement((new HtmlElement('h1')));
$div->addElement((new HtmlElement('span')));

$div->setIsTagHidden(true);

echo $div; will output:

Content:
<h1></h1>
<span></span>

Additional Attribute manipulation methods

->removeAttribute( string )

Removes an attribute of a given name.

$div = (new HtmlElement('div'))
    ->setAttribute('id', 'superDiv')
    ->setAttribute('class', 'normalDiv');

$div->removeAttribute('id');

echo $div; will output:

<div class="normalDiv"></div>

->getAttribute( string )

Search for an attribute of a given name and returns it or null if nothing found.

$div = (new HtmlElement('div'))
    ->setAttribute('id', 'superDiv')
    ->setAttribute('class', 'normalDiv');

$attribute = $div->getAttribute('id');

echo $attribute; will output:

superDiv

->getAttributes()

Returns array of attributes.

$div = (new HtmlElement('div'))
    ->setAttribute('id', 'superDiv')
    ->setAttribute('class', 'normalDiv');

$attributes = $div->getAttributes();

Additional Content and Element methods

->getElements()

Returns array of inner HtmlElements.

$div = new HtmlElement('div');
$div->addElement((new HtmlElement('h1')));
$div->addElement((new HtmlElement('span')));

$innerElements = $div->getElements();

->getContent()

Returns content string (set by setContent method).

$div = new HtmlElement('div');
$div->setContent('Hello');

$content = $div->getContent();

Class Attribute manipulation methods

This methods allows for advanced manipulation of "class" attribute. This methods can be mixed with normal $htmlElement->setAttribute('class', ...) usage.

->addClass( string )

Adds given className to attribute "class" of given element.

$div = (new HtmlElement('div'))
    ->addClass('superDiv')
    ->addClass('normalDiv');

echo $div; will output:

<div class="superDiv normalDiv"></div>

->removeClass( string )

Removes class of given className from "class" attribute.

$div = (new HtmlElement('div'))
    ->setAttribute('class', 'classNameA classNameB classNameC');

$div->removeClass('classNameB');

echo $div; will output:

<div class="classNameA classNameC"></div>

Style Attribute manipulation methods

This methods allows for advanced manipulation of "style" attribute. This methods can be mixed with normal $htmlElement->setAttribute('style', ...) usage.

->addStyles( string, string )

Allows to add single style to "style" attribute.

$div = (new HtmlElement('div'))
    ->addStyles('color', 'red')
    ->addStyles('font-size', '2em');

echo $div; will output:

<div style="color: red; font-size: 2em"></div>

->addStyles( array )

Adds array of styles to "style" attribute.

$div = (new HtmlElement('div'))
    ->addStyles([
        'color' => 'red',
        'font-size' => '2em'
    ]);

echo $div; will output:

<div style="color: red; font-size: 2em"></div>

->removeStyles( string )

Removes style of given styleName from the "style" attribute.

$div = (new HtmlElement('div'))
    ->addAttribute('style', 'color: red: font-size: 2em');

$div->removeStyles('color');

echo $div; will output:

<div style="font-size: 2em"></div>

->removeStyles( array )

Removes styles given in array of styleName from the "style" attribute.

$div = (new HtmlElement('div'))
    ->addAttribute('style', 'color: red: font-size: 2em; width: 100px');

$div->removeStyles(['color', 'font-size']);

echo $div; will output:

<div style="width: 100px"></div>