javascript - 在 HTML + Javascript 中使用自定义属性/指令

Question

我一直在经历vue.js和angular.js代码，但无法弄清楚它们如何处理 html 中的自定义指令？

例如，假设我有以下 div: <div my-repeat="item in items"></div>

实现类似于vue.js的东西是的，我是否必须扫描整个文档的 DOM 元素才能找到所有出现的 my-属性前缀，然后以某种方式尝试找出其其余功能的作用？

我确实花了几个小时试图解决这个问题，但没有运气。任何想法/指示将不胜感激。

Answer 1

我不确定 Vue 和 Angular 是如何做到这一点的，但这里有一个示例，说明如何实现自定义属性中指定的功能:

var element = document.querySelector('[function-attribute]');
var fn = new Function(element.attributes['function-attribute'].value).bind(element);
fn();

<div value-attribute='something' function-attribute="alert(this.attributes['value-attribute'].value);"></div>