How to highlight some attribute value of some XML tags in Emacs Web mode?

Question

I'm using the excellent web-mode in Emacs for editing XML files.

I would like to highlight some attribute value from specific tags. How is that possible?

For example, in the following file:

<panel type="console" ds="DS_CONSOLE_EQ" layout="mainLayout">
    <title>Filter</title>
    <field table="eq" id="BL_ID"/>
    <field table="eq" name="fl_id"/>
    <field table="eq" name="rm_id"/>
    <field table="eq" name="eq_id"/>
</panel>

I would like to highlight the value from every

• ds attribute from the panel tag, and
• id attribute from the field tag.

In this case, ds_console_eq and bl_id would be highlighted (with 2 different faces). I've put them in caps letter to show the results.

Answer 1

You could do this using font-lock-mode just change font-lock-type-face and font-lock-keyword-face to whatever faces you want

(add-hook 'web-mode-hook
 (lambda ()
  (font-lock-add-keywords nil
   '(("\\<ds_console_eq\\>" . font-lock-type-face)
     ("\\<bl_id\\>" . font-lock-keyword-face)))))