Question

我正在emmet工具包的帮助下编写HTML代码，并想知道是否有办法将唯一文本值（预定义为某种列表）传递给emmet html元素生成器表达式。

<!-- Example:  -->

  span.myClass{textValue$}*4

 <!--Will yield:  -->
  <span class="myClass">textValue1</span>
  <span class="myClass">textValue2</span>
  <span class="myClass">textValue3</span>
  <span class="myClass">textValue4</span>

<!--Desired: -->

  textValues = ["as","gh","xc"];

  <!-- Some generator expression, G(textValues), that yields this -->
    <span class="myClass">as</span>
    <span class="myClass">gh</span>
    <span class="myClass">xc</span>

我想知道是否有内置方法或聪明的生成器表达式可以实现此目的。

Answer 1

当你有现有的文本并且你想用 HTML 标签包裹它时

仅供参考，我使用 CodePen 作为文本正文的包装缩写，下面的一些示例和一些我只是用乘数生成它们。

textValue
textValue
textValue
textValue

熟悉 Emmet 命令

突出显示文本
然后按（在 macOS 上为 ⇧+⌘+A，在 Windows 上为 ⇧+CTRL+A）
您将在模式中看到一个带有“输入缩写”的输入字段弹出窗口

无序列表和列表示例：

在“输入缩写”中输入：

ul>li*

或者如果您想将自定义文本 {} 或数字 $ 或您拥有的内容放在无序列表的自定义文本的前面或后面。有序列表 ol 将给出默认编号列表。如果需要，您可以自定义文本，然后运行查找和替换。

ul>li{textValue $}*

这个例子会是这样的

<ul>
    <li>textValue 1</li>
    <li>textValue 2</li>
    <li>textValue 3</li>
    <li>textValue 4</li>
</ul>

您想要的解决方案

在“输入缩写”中输入您想要的解决方案以环绕现有文本：

span.myClass>li*

用于生成带有有序数字的自定义文本的所需解决方案

span.myClass{textValue $}*4

<span class="myClass">textValue 1</span>
<span class="myClass">textValue 2</span>
<span class="myClass">textValue 3</span>
<span class="myClass">textValue 4</span>

据我所知，您可以为自己的文本编辑器创建自己的 Emmet 片段。您还可以在 CodePen 中创建自己的自定义选项卡触发器（查看链接）https://blog.codepen.io/documentation/tab-triggers/

这是要为 https://docs.emmet.io/cheat-sheet/ 添加书签的 Emmet 备忘单

将值列表传递给emmet生成器表达式

1 个答案: