README

最灵活的php HTML视图构建器之一。它使用与HTML标签和属性相同的命名约定在PHP文件中构建视图。

安装

这是一个composer包。因此，请将此包添加到您的php/framework项目的composer.json中，或运行以下命令：

composer require amsrafid/tagger

基本使用

非常容易使用。属性和标签名称与普通HTML相同。最值得注意的是，sudo或短名称也作为正常HTML属性工作。

\Html\Tag::{Tag name}([
	'i/id' => 'id-name',
	'c/cls/class' => 'class-name',
	'd-./_./*./data-.' => 'data-value',
	'b/body/txt/text' => string|array|number|bool|function(){} /* tag body*/
	...
]);

数组键指属性名称，键值指属性值。
注意：数据属性也以sudo的方式处理，如[d-name/_name/*name]。
在上面的所有情况下，属性名称将是data-name。

属性 'body'

属性 body 是标签的嵌套部分。Body可以是五种类型。字符串或数字是基本类型。特殊类型包括：

Array 类型
- 在这里，只允许显示关联数组。在这种情况下，arry key 表示 tag name，而 value 是一个 sequential array，其中每个值是主数组键中命名的每个标签的body。
- 示例
```
 use Html\Tag;

 Tag::ul(['b' => ['li' => ['one', 'two', 'three']]]);
```
- 输出
```
 <ul>
 	<li>one</li>
 	<li>two</li>
 	<li>three</li>
 </ul>
```

Object 类型

返回要在body中显示的 string、number 或 associative array。
主要地，object类型表示一个包含母标签嵌套元素的 function。
示例

 Tag::div(function(){
 	Tag::h4("First set:");
 	Tag::hr();
 	Tag::div(['b' => 'Having fun, isn\'t it?']);
 	Tag::div(function(){
 		Tag::span(function(){ return "One"; });
 		Tag::span(2);

 		return [
 			'h3' => ['array', 'returned'],
 			'u' => ['test', 'underline'],
 		];
 	});
 });

输出

 <div>
 	<h4>First set:</h4>
 	<hr>
 	<div>Having fun, isn't it?</div>
 	<div>
 		<span>One</span>
 		<span>2</span>
 		<h3>array</h3>
 		<h3>returned</h3>
 		<u>test</u>
 		<u>underline</u>
 	</div>
 </div>

Boolean 类型
- 当body上没有内容显示时，布尔类型工作。但是，标签不是像<img />这样的单标签。在这种情况下，body值应提供为 true。
- 示例
```
 Tag::script(["s"=>"https://script.js", 'b' => true]);
```
- 输出
```
 <script src="https://script.js"></script>
```

sudo属性可用

以下列出了 sudo 属性列表。

a 		=	alt,
ac		=	action,
c 		=	class,
cls		=	class,
cont		=	content,
cs 		=	colspan,
d 		=	disabled,
dt 		=	datetime,
f 		=	for,
fa 		=	formaction,
h 		=	href,
i  		=	id,
ln 		=	lang,
m 		=	method,
mx 		=	max,
mn 		=	min,
mxlen		=	maxlength,
mnlen		=	minlength,
mt 		=	muted,
n  		=	name,
p  		=	placeholder,
pt		=	pattern,
r 		=	required,
rs 		=	rowspan,
rw 		=	rows,
s  		=	src,
sc		=	selected,
st		=	style,
t  		=	type,
v 		=	value,
val		=	value

预设功能

Tagger允许预设 attributes 和 wrapper。它减少了在相同标签上使用相同的属性和包装。

相同标签的预设属性

预设功能通过使用 set 方法在常见的属性值上工作。在这里，可以使用 stopSet 方法停止预设，该方法接受 string 或 array 的标签名称，或为销毁所有内容留空。

Tag::set([
	'input' => [
		'c/cls/class' => 'form-control mt-2',
		...
	],
	'textarea' => '@input',		/* Same as input tag */
	...
]);

Tag::input(['type' => 'text']);
Tag::input(['type' => 'number']);
Tag::textarea(['b' => 'Text area', 'c' => 'text-danger']);

Tag::stopSet();

输出

<input type = "text" class = "form-control mt-2" />
<input type = "number" class = "form-control mt-2" />
<textarea class = "text-danger form-control mt-2">Text area</textarea>

相同标签的预设包装器

与 set 包装功能类似，使用 wrap 方法在常见的包装器值上工作。在这里，也可以使用 stopWrap 方法停止标签包装，该方法接受 string 或 array 的标签名称，或为销毁所有内容留空。

Tag::wrap([
	'input' => ['div', ['c' => 'col-md-6', ...]],
	'textarea' => 'div',
	'select' => '@input'	/* Same as input tag */
	...
]);

Tag::input(['t' => 'text']);
Tag::textarea();
Tag::select(['b' => ['option' => ['one', 'two']]]);

Tag::stopWrap(['textarea']);	/* OR Tag::stopWrap('textarea'); */
Tag::textarea("Text area value");

输出

<div class = "col-md-6"><input type = "text" /></div>
<div><textarea></textarea></div>
<div class = "col-md-6">
	<select>
		<option>one</option>
		<option>two</option>
	</select>
</div>
<textarea>Text area value</textarea>

特殊用途

表格

在这里，可以动态生成HTML表格。其中，body 可以传递一个数组，其中 key 是 tag name，而 key value 是标签体的常规 array。

$arrs = [
	['id' => 24, 'name' => 'HTML'],
	['id' => 33, 'name' => 'CSS'],
	['id' => 49, 'name' => 'JAVASCRIP']
];
	
Tag::table(['border' => '1', 'b' => function() use($arrs) {
	Tag::tr(['b' => ['th' => ['#', 'ID', 'Name']]]);
	Tag::tr(['foreach' => $arrs, 'offset' => 'i'
		'b' => ['td' => ['@i', '@id', '@name']]
	]);
}]);

输出

<table border = "1">
	<tr><th>#</th><th>ID</th><th>Name</th></tr>
	<tr><td>1</td><td>24</td><td>HTML</td></tr>
	<tr><td>2</td><td>33</td><td>CSS</td></tr>
	<tr><td>3</td><td>49</td><td>JAVASCRIP</td></tr>
</table>

控制语句

控制语句在这里的作用类似于普通的 foreach/if/elseif/else。控制语句用作属性。

foreach

类似于PHP中的正常foreach循环。在这里，offset和start分别用于循环数组/对象的偏移量，并从哪个值开始计数。

Tag::ul(['if' => $arrs, 'b' => function() use($arrs) {
	Tag::li([
		'foreach' => $arrs, 'offset' => 'i',
		'if' => '@id > 24',
		'v' => '@id', 'b' => '@i. @name'
	]);
}]);

输出

<ul>
	<li value="33">1. CSS</li>
	<li value="49">2. JAVASCRIP</li>
</ul>

@id -> @{数组键名}。
可以捕捉任何属性值。

特殊属性：以下属性只有在存在foreach属性时才有用。

'if' => 字符串
- 正常的if条件。例如：(@i > 2 && (@age == 50 || @name == 'HTML'))。
- 在这里，@i是偏移量，@name是数组键。
- 注意：@name的值是字符串类型。所以，比较字符串值必须用双引号括起来。
'then' => 字符串|数组
- 当'if'条件有效时，此属性才会起作用。
- 字符串类型的值被视为属性值true。多个字符串可以视为相同的属性，用逗号、分号、点或空格分隔, OR ; OR . OR \s+。
- 示例
  - 'then' => 'selected disabled'
  - 'then' => ['selected' => true, 'disabled' => true]
- 这里，数组包含属性集，将在有效的if条件后更改。
'offset' => 字符串
- 包含循环数组偏移变量名。
- 在逻辑表达式中，从0开始，根据start属性决定可见范围。
'start' => 整数
- 表示从哪里开始偏移。默认的起始值是1。

if

类似于PHP的普通if语句。
注意：在foreach特殊属性部分，允许以相同的方式使用属性then。但在这里，只有数组类型值起作用。

$var = 10;
Tag::span(['if' => $var > 10, 'b' => 'Var is greater than 10']);

普通用法

if($var > 10)
	echo "<span>Var is greater than 10</span>

elseif

类似于PHP的普通elseif语句。这里，此条件只有在前面存在if语句时才会起作用。
注意：允许以与if语句相同的方式使用属性then。

Tag::span(['elseif' => $var > 5, 'b' => 'Var is greater than 5']);

普通用法

if ($var > 10)
	...
else if ($var > 5)
	echo "<span>Var is greater than 5</span>

else

类似于PHP的普通else语句。值应该给出为true。这里，此条件只有在前面存在if或elseif语句时才会起作用。
注意：这里不允许使用属性then。

Tag::span(['else' => true, 'b' => 'Var is less than 5']);

普通用法

if ($var > 10)
	...
else
	echo "<span>Var is less than 5</span>

作者

最初开发 - 萨丹·拉菲德

许可证

标签器是开源软件，根据MIT许可证授权。

amsrafid /

维护者

详情

README

安装

基本使用

属性 'body'

sudo属性可用

预设功能

相同标签的预设属性

相同标签的预设包装器

特殊用途

标签

表格

控制语句

foreach

if

elseif

else

作者

许可证