All Spatie\Html\Elements
have some methods that make working with elements easy. All these methods can be chained together fluently and every method will return a new Element
instance. This way you can preserve the original Element
if necessary.
##Available methods
##attribute()
Sets an attribute on the element:
echo Div::attribute('data-custom', 'Attribute value');
// "<div data-custom="Attribute value"></div>"
##attributeIf()
Only sets an attribute on the element if a condition is met:
echo Div::attributeIf(50 > 100, 'data-custom', 'Attribute value');
// "<div></div>"
##attributes()
Sets multiple attributes from an array or collection:
echo Div::attributes(['data-id' => '123', 'data-username' => 'John']);
// "<div data-id="123" data-username="John"></div>"
##forgetAttribute()
Remove an attribute from an element:
echo Div::attribute('data-custom', 'Attribute value')
->forgetAttribute('data-custom');
// "<div></div>"
##getAttribute()
Get the value of an element's attribute:
echo Div::attribute('data-custom', 'Attribute value')
->getAttribute('data-custom');
// "data-custom"
You may also specify a fallback value:
echo Div::getAttribute('data-username', 'Unknown');
// "Unknown"
##class()
Adds a class to the element.
echo Div::class('btn');
// "<div class="btn"></div>"
Sets the id of the element overwriting any previously set id
s:
echo Div::id('btn-123');
// "<div id="btn-123"></div>"
##child()
and children()
Adds one or more child elements to the element:
echo Div::child(P::text('This is the first paragraph'))
// "<div><p>This is the first paragraph</p></div>"
echo Div::children([P::text('This is the first paragraph'), Span::text('Span content')])
// "<div><p>This is the first paragraph</p><span>Span content</span></div>"
You may also provide a mapper function that will be called for each child:
$content = ['First paragraph', 'Second paragraph', 'Third paragraph'];
echo Div::children($content, function ($content) {
return P::text($content); // A new `<p>` element will be created for each string and added as a child of `<div>`
});
// "<div><p>...</p><p>...</p><p>...</p></div>"
##prependChild()
and prependChildren()
Prepends one or more child-elements before the existing children on the element.
$paragraphOne = P::text('First');
$paragraphTwo = P::text('Second');
$divElement = Div::child($paragraphTwo)
->preprendChild($paragraphOne);
// <div><p>First</p><p>Second</p></div>
Just like the children()
method you may provide a mapper function as the second argument that will be called for each child to be prepended.
##text()
Sets the inner contents of the element. Any HTML will be escaped with htmlentities()
(if you do wish to add inner HTML use html()
).
echo Div::text('This text is "ironic"');
// "<div>This text is "ironic"</div>"
Condintionally transform the element. Note that since elements are immutable, you'll need to return a new instance from the callback.
echo Div::if(10000 > 9000, function ($divElement) {
return $divElement->text('10.000 is over 9.000');
});
// "<div>10.000 is over 9.000</div>"
##open()
Returns the elements opening tag as a Illuminate\Support\HtmlString
including all children.
echo Div::child(P::text('First child'))->open();
// "<div><p>First child</p>"
In combination with the close()
method this can be really useful for rendering forms:
{{ Form::action('/post-url')->method('POST')->open() }}
<!-- Other form inputs here -->
{{ Form::close() }}
##close()
Returns the elements closing tag as a Illuminate\Support\HtmlString
(if the element is not a void element like for example <br>
).
echo Div::child(P::text('First child'))->close();
// "</div>"
##render()
Returns the complete element including all children as a Illuminate\Support\HtmlString
.
echo Div::child(P::text('First child'))->render();
// "<div><p>First child</p></div>"