点击这里
描述 (Description)
使用数据属性，插件连接到HTML元素，因为它们与插件的名称相匹配。 虽然大多数插件可以嵌套在其他插件中，但单个HTML元素一次只能有一个插件。 例如，工具提示链接是通过添加data-tooltip创建的。
例子 (Example)
以下示例演示如何使用将HTML元素连接到Foundation中的插件。
<html>
<head>
<title>JavaScript Example</title>
<link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/css/foundation.css">
</head>
<body>
<p><span data-tooltip aria-haspopup = "true" class = "has-tip"
data-disable-hover = 'false' tabindex = 1 title = "Advanced Front-End Framework."
>Foundation</span> has powerful grid system and some useful UI
components and cool JavaScript plugins.</p>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/js/vendor/jquery.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/js/foundation.min.js"></script>
<script>
$(document).ready(function() {
$(document).foundation();
})
</script>
</body>
</html>
输出 (Output)
让我们执行以下步骤，看看上面给出的代码是如何工作的 -
保存上面给出的html代码javascript_using_plugins.html文件。
在浏览器中打开此HTML文件，输出显示如下。
