I love creating HTML elements using the MooTools JavaScript library. It's easy, fast, and the JavaScript code to create the element is beautiful. That got me thinking -- why don't I do this using PHP? When you build as many dynamic CMS-like websites as me, you end up having to manipulate single HTML element attributes with a bunch of if/else logic and the code can start looking ugly.
我喜欢使用MooTools JavaScript库创建HTML元素。 这很容易,快速,并且创建元素JavaScript代码很漂亮。 这让我开始思考-为什么我不使用PHP进行此操作? 当您像我一样建立许多像CMS一样的动态网站时,最终不得不使用一堆if / else逻辑来操纵单个HTML元素属性,并且代码可能看起来很丑。
I took about a half hour to throw together the following PHP class. It's small, easy to use, and produces beautiful code--just like Moo!
我花了大约半小时来整理以下PHP类。 它很小,易于使用,并且可以生成漂亮的代码,就像Moo一样!
PHP (The PHP)
/* creates an html element, like in js */
class html_element
{
/* vars */
var $type;
var $attributes;
var $self_closers;
/* constructor */
function html_element($type,$self_closers = array('input','img','hr','br','meta','link'))
{
$this->type = strtolower($type);
$this->self_closers = $self_closers;
}
/* get */
function get($attribute)
{
return $this->attributes[$attribute];
}
/* set -- array or key,value */
function set($attribute,$value = '')
{
if(!is_array($attribute))
{
$this->attributes[$attribute] = $value;
}
else
{
$this->attributes = array_merge($this->attributes,$attribute);
}
}
/* remove an attribute */
function remove($att)
{
if(isset($this->attributes[$att]))
{
unset($this->attributes[$att]);
}
}
/* clear */
function clear()
{
$this->attributes = array();
}
/* inject */
function inject($object)
{
if(@get_class($object) == __class__)
{
$this->attributes['text'].= $object->build();
}
}
/* build */
function build()
{
//start
$build = '<'.$this->type;
//add attributes
if(count($this->attributes))
{
foreach($this->attributes as $key=>$value)
{
if($key != 'text') { $build.= ' '.$key.'="'.$value.'"'; }
}
}
//closing
if(!in_array($this->type,$this->self_closers))
{
$build.= '>'.$this->attributes['text'].'</'.$this->type.'>';
}
else
{
$build.= ' />';
}
//return it
return $build;
}
/* spit it out */
function output()
{
echo $this->build();
}
}
The class is pretty simple. When you instantiate the class, you feed it the element type. Once the element is created, you use get() to retrieve values and set() (key and value OR array key=>value) to set values. You can get rid of a specified attribute using remove() or all attribute key=>values using clear(). You can inject html_elements into other html_elements by using inject(). You can get the raw HTML of the element using build() or you can use the output() function to echo out the HTML. Important: use the "text" attribute to add text/HTML inside an element.
该类非常简单。 实例化类时,将元素类型提供给它。 创建元素后,可以使用get()检索值,并使用set() (键和值或数组键=> value)来设置值。 您可以使用remove()摆脱指定的属性,或者使用clear()摆脱所有属性key => values。 您可以使用inject()将html_elements注入其他html_elements中。 您可以使用build()获得元素的原始HTML,也可以使用output()函数回显HTML。 重要:使用“文本”属性在元素内添加文本/ HTML。
示例用途 (Example Uses)
/* test case - simple link */
$my_anchor = new html_element('a');
$my_anchor->set('href','https://davidwalsh.name');
$my_anchor->set('title','David Walsh Blog');
$my_anchor->set('text','Click here!');
$my_anchor->output();
//<a href="https://davidwalsh.name" title="David Walsh Blog">Click here!</a>
/* test case - br tag */
echo '<pre>';
$my_anchor = new html_element('br');
$my_anchor->output();
//<br />
/* test case - sending an array to set */
echo '<pre>';
$my_anchor = new html_element('a');
$my_anchor->set('href','https://davidwalsh.name');
$my_anchor->set(array('href'=>'http://cnn.com','text'=>'CNN'));
$my_anchor->output();
//<a href="http://cnn.com">CNN</a>
/* test case - injecting another element */
echo '<pre>';
$my_image = new html_element('img');
$my_image->set('src','cnn-logo.jpg');
$my_image->set('border','0');
$my_anchor = new html_element('a');
$my_anchor->set(array('href'=>'http://cnn.com','title'=>'CNN'));
$my_anchor->inject($my_image);
$my_anchor->output();
//<a href="http://cnn.com" title="CNN"><img src="cnn-logo.jpg" border="0" /></a>
Have any ideas for this class? Share them!
对这个课程有什么想法吗? 分享他们!