当前位置: 首页 > 知识库问答 >
问题:

使用自定义超文本标记语言标记并用outerHTML替换自定义标记可以吗?

顾光明
2023-03-14

定义和使用自定义标记可以吗?(这不会与将来的html标记冲突)-通过更改outerHTML替换/呈现这些标记??

我在下面创建了一个演示,看起来效果不错


    <!DOCTYPE HTML>
    <html lang="en-US">
    <head>
        <script type="text/javascript" src="jquery.min.js"></script>
    </head>

    <body>

    <div id="customtags">
        <c-TextField name="Username" ></c-TextField> <br/>
        <c-NameField name="name" id="c-NameField"></c-NameField> <br/>
        <c-TextArea name="description" ></c-TextArea> <br/>
        <blahblah c-t="d"></blahblah>
    </div>
    </body>


    <script>

    /* Code below to replace the cspa's with the actual html -- woaah it works well */    
        function ReplaceCustomTags() {
            // cspa is a random term-- doesn;t mean anything really
            var grs = $("*"); 
            $.each(grs, function(index, value) {
                var tg = value.tagName.toLowerCase();
                if(tg.indexOf("c-")==0) {
                    console.log(index);
                    console.log(value);
                    var obj = $(value);
                    var newhtml;
                    if(tg=="c-textfield") {
                        newhtml= '<input type="text" value="'+obj.attr('name')+'"></input>';
                    } else if(tg=="c-namefield") {
                        newhtml= '<input type="text" value="FirstName"></input><input type="text" value="LastName"></input>';
                    } else if(tg=="c-textarea") {
                        newhtml= '<textarea cols="20" rows="3">Some description from model</textarea>';
                    }
                    obj.context.outerHTML = newhtml;
                }


                z = obj;
            });
        }

        if(typeof(console)=='undefined' || console==null) { console={}; console.log=function(){}}

        $(document).ready(ReplaceCustomTags);
    </script>
    </html>

问题的最新情况:

让我进一步解释一下。请假设浏览器上启用了JavaScript-也就是说,应用程序不应该在没有javascript的情况下运行。

我见过使用自定义属性在指定标记中定义自定义行为的库。例如,角度。js大量使用自定义属性。(它还有关于自定义标记的示例)。虽然我的问题不是从技术策略的角度提出的,但我无法理解为什么它会在策略上导致代码的可伸缩性/可维护性问题。

根据我的代码

有棱角的js确实显示了一个自定义标记示例(窗格/选项卡)。在我上面的示例中,我使用outerHTML替换这些自定义标记-虽然我在库中没有看到这样的代码-我使用outerHTML替换自定义标记是否做了一些短视和错误的事情?

共有2个答案

夏侯腾
2023-03-14

这很可能行得通,但这可能不是个好主意。屏幕阅读器和搜索引擎可能很难/不可能阅读你的页面,因为他们可能无法解释JavaScript。虽然我明白这一点,但最好使用这个模板来开发,然后在把它放在服务器上之前把它“烘烤”成超文本标记语言。

宇文元明
2023-03-14

我想不出你为什么要这么做。

如果你必须从事一个由其他人编写的项目,而这些人忽略了所有的常规做法和惯例,你会怎么想?如果他们不再在公司寻找他们为什么以某种方式做事,会发生什么?

事实上,你必须通过JavaScript才能让它工作,这应该是一个巨大的危险信号。除非你有一个非常好的理由,帮你自己一个忙,使用预先存在的标签。六个月后,你会记得你为什么那样做吗?

 类似资料:
  • 导出为HTML会生成以下内容: 报告在页面上居中,但应左对齐。 使用JRHtmlExporter的HTML\u HEADER参数看起来很有希望,但这些类已被弃用。这就是解决方案: 现在我必须使用网络。旧金山。jasperreports。出口HtmlExporter和net。旧金山。jasperreports。出口SimpleHtmlReportConfiguration类,如下所示: 您将如何修复

  • 我有使用ckeditor生成的html文本,在我的文本中有一些非html标记,它们没有被显示,因为它们被认为是html标记。 我想将所有非HTML标记替换为HTML实体。我用str_replace做了大多数标记,但现在我有大约100个不同的标记,像

  • 问题内容: 我正在尝试创建一种类似于英语的小型语言来指定任务。基本思想是将陈述分为动词和名词短语,这些动词应适用于它们。我正在使用nltk,但未获得我希望的结果,例如: 在每种情况下,它都未能意识到第一个单词(选择,移动和复制)被用作动词。我知道我可以创建自定义标签和语法来解决此问题,但是与此同时,当很多此类东西不在我的支持范围内时,我犹豫要重新发明轮子。我特别希望可以同时处理非英语语言的解决方案

  • 我在这里做错了什么: 我一直在 但这很好: 显然我想避免 没有也不行,我的jstl不知道

  • 我正在使用React视图上的Highcharts。出于可访问性和搜索引擎优化的原因,我想定制标记,但我在文档中找不出如何实现。Highcharts会自动插入一个标记,如下所示: <代码> 有没有办法改变这一点,或者这是硬编码的?

  • 因此,我想访问子标记result1、result2、result3中父标记属性test1、test2、test3(这些属性的返回值为true/false)的结果,以根据返回的条件值显示输出,不管它是true还是false。 谢谢,开发者。