如何让 emmet 将具有值的属性添加到 div 标签中？

Posted 2023-02-21

【中文标题】如何让 emmet 将具有值的属性添加到 div 标签中？

【英文标题】：How do I get emmet to add an attribute with a value into a div tag?

【发布时间】：2015-12-29 21:25:33

【问题描述】：

我正在使用 emmet.vim 插件。

如何编写 emmet 速记来说明没有值的属性？

这是我写的：

div.contain-to-grid.sticky>nav.topbar[data-topbar]

这就是我想要发生的事情：

<div class="contain-to-grid sticky">
  <nav class="topbar" data-topbar></nav>
</div>

这是我得到的：

<div class="contain-to-grid sticky">
  <nav class="topbar" data-topbar=""></nav>
</div>

而不是创建一个没有值的属性：

数据顶栏

它正在创建一个空值：

data-topbar=""

有解决办法吗？如果没有，那么我可以忍受它。很高兴知道它是否可以完成。谢谢

【问题讨论】：

虽然文档似乎没有反映这一点，但this closed issue 表示已向 Emmet 添加了对布尔属性的支持，语法为 div[my-attribute.]，应扩展为 <div my-attribute></div>。这在 Sublime Text 中对我有用。

【参考方案1】：

Emmet-vim 的行为已从documentation 更改为预期的那样：

您不必指定属性值：td[colspan title] 将 产生<td colspan="" title="">，每个空的都有制表位 属性（如果您的编辑器支持它们）。

所以没有。您可以在此处关注此请求：Attributes without values not being expanded。

可能的粗略解决方法是将 autoload/emmet/lang/html.vim 中的第 220 行从

let current.attr[atts] = ''

到

let current.attr[atts] = function('emmet#types#true')

【讨论】：

好的。这对我来说已经足够好了。没有这种能力，Emmet 为我节省了足够的时间。谢谢！

虽然文档似乎没有反映这一点，但this closed issue 表示已向 Emmet 添加了对布尔属性的支持，语法为 div[my-attribute.]，应扩展为 <div my-attribute></div>。这在 Sublime Text 中对我有用。

【参考方案2】：

我只是复制@Alexander Nied 的评论以使其更引人注目，它说

虽然文档似乎没有反映这一点，但这个已关闭的问题表明已使用 div[my-attribute.] 的语法向 Emmet 添加了对 boolean attributes 的支持，该语法应扩展为 This works for me in Sublime Text

这对我也有用，Intellij idea