1

我正在编写一些 HTML 代码，如果多行代码是正确的话，我在尝试“总结”时遇到了麻烦。基本上我有一个选择标签，我想在 HTML 代码中多次放置，但我不想一遍又一遍地重写。这个动作的名称是什么？是宏吗？一个片段？一个 HTML 函数？

基本上：

<select>
<option value="default">-Select an Attribute-</option>
<option value="animal">animal</option>
<option value="person">person/human</option>
<option value="cat">cat</option>
<option value="dog">dog</option>
<option value="open">open space</option>
<option value="closed">closed space </option>
<option value="natural">natural</option>
<option value="artificial">artificial</option>
<option value="explicit">explicit</option>
<option value="sexual">sexual</option>
<option value="innocent">innocent</option>
<option value="fearful">fearful</option>
<option value="religious">religious</option>
</select>

每次我想使用该选择标记代码片段时，我可以定义快捷方式或宏吗？这个过程在 HTML 术语中叫什么，所以我可以记住它以供将来参考？

我不能做类似的事情：

<select id="snippet">
</select>

在进行第一次定义后，这可以节省我的代码行吗？

4

2 回答 2

2

这在纯 HTML 中是不可能的。您要么需要 Javascript 来在客户端执行此操作，要么需要使用 PHP、Python、Perl 等为您执行此操作的服务器端脚本......

作为如何使用 Javascript执行此客户端的示例，请查看此代码：（在此 JSFiddle 上查看它的实际操作：http: //jsfiddle.net/TZ2gV/）

options = {
    'default':'Select an Attribute',
    'animal':'animal',
    'person':'person/human'
};
$.each(options, function(key, value) {
    $('#mySelect')
    .append($("<option></option>")
            .attr("value",key)
            .text(value)); 
});

使用此 HTML：

<form>
    Select: <select id="mySelect">
    </select>
</form>

或者，使用此服务器端PHP 代码，您会得到相同的结果（您可以在此处看到它的实际效果：http: //codepad.org/O5zZ65tZ）

<form>
    Select: <select id="mySelect">
        <?php
            $options = array(
                   'default'=>'Select an Attribute',
                   'animal'=>'animal',
                   'person'=>'person/human'
            );
            foreach ($options as $key => $value) {
                echo "<option value='".$key."'>".$value."</option>\n";
            }
        ?>
    </select>
</form>

但是在这两种情况下，您并没有为自己节省很多击键，而不仅仅是自己制作 HTML。您最好提出一个新问题，解释您的实际情况以及您正在尝试做什么。

于 2013-07-02T05:26:03.777 回答
1

正如乐高所说，你不能在纯 HTML 中做到这一点。如果您使用 JavaScript，有一些模板库可以提供帮助。我建议的一对是：

这篇文章可能会有所帮助How to use underscore.js as a template engine?

于 2013-07-02T05:31:17.790 回答