如何使用自定义 html 标记来告诉脚本将 html 放在哪里

How to use custom html tags to tell scripts where to put html?

本文关键字：html 脚本 在哪里 何使用 自定义      更新时间：2023-09-26

我构建了一个加载了外部脚本的插件，它基本上包含一些用户可能想要放置在他们身体中的按钮和小部件。

但是我不确定他们如何告诉插件将插件中的按钮放在哪里，我注意到 facebook 为他们喜欢和登录插件做了一些自定义标签：

<fb:login-button show-faces="true"></fb:login-button>

还有哪些其他选择？如何将这样的元素替换为按钮的 html？

试试这个。 让用户创建这样的标记。 如果需要是内联控件，则可以使用范围。

<div data-yourPluginName="typeOfControl"></div>

然后让你的插件像这样替换该标记：

$(function() {
    $('[data-yourPluginName]').each(function() {
        var controlType = $(this).attr('data-yourPluginName');
        var replaceThis = $(this);
        if(controlType === 'foo') {
            // transform 'replaceThis' into a 'foo'
        } else if( controlType === 'bar' ) {
            // make it a 'bar'
        }
    });
});

如果您真的想使用自定义标签，代码是类似的：

//instead of:
$('[data-yourPluginName]').each(function() {
// simply use:
$('customTag1, customTag2').each(function() {
    var controlType = $(this).prop('tagName'); // this will be CUSTOMTAG1 in capitals
相关文章：