使用自定义标签的区别,自定义标签在IE6

自定义标签在IE6-8的窘境

2015/07/20 · HTML5 ·
IE,
自定义标签

初稿出处:
司徒正美   

唯恐以后前端组件化之路都是自定义标签,但那东西早在20年前,JSTL已在搞了。现在Web
Component还唯有webkit帮助。但一个组件库,还亟需一个与众差其余标识它们是一块的。但是这几个XML已经帮大家搞定了,使用scopeName,如”<xxx:dialog>”。在自身继续往下想什么处理如何为那个标签绑定数据,与此外零件通讯,管理生命周期,等等大事以前,我还有一个只可以面对的题材,就是如何包容IE6-8!

比如说以下一个页面:

澳门葡京 1

在chrome, firefox, IE11, IE11的IE6包容方式分别如下:

澳门葡京 2
澳门葡京 3
澳门葡京 4
澳门葡京 5

大家会意识IE6下实际是多出不可枚举标签,它是把闭标签也成为一个单身的要素节点

澳门葡京 6

使用自定义标签的区别,自定义标签在IE6。本条AA:DIV标签被开膛破肚,里面子节点全体暴出来,成为其兄弟节点了。因而想包容它,就要费点劲。有个五个景况需求考虑,1是用户已经将它写在页面上,景况同上;2是用户是将它放在字符串模版中,这几个用正则搞定。可是正则如果撞倒复杂的属性名,依旧会晕掉。由此我要么打算利用原生的HTML
parser。换言之,字符串,我照旧会将它变成节点。这么办呢?!我想了广大主意,后来或者选取VML的命名空间法搞定!

咱俩将上面的页面改复杂点,再看看效果!

澳门葡京 7
澳门葡京 8

可以看到其套嵌关系现在完全正确,并且标签名不会大写化,也不会转变多余节点!

好了,大家再判定一下是还是不是为自定义标签,或者纯粹地说,那个节点是还是不是大家组件库中定义的自定义标签。某些情形下,一个页面可以存在多套组件库,包涵avalon的,ploymer的,或者是一贯用Web
Component写的。

avalon的零件库将动用命名空间,那样就好界别开。在IE6-9中,判定element.scopeName是或不是为aa(那是组件库的命名空间,你可以改个更宏大上的名字),在任何浏览器判定此因素的localName是不是以aa:伊始就行了!

JavaScript

function isWidget(el, uiName){ return el.scopeName ? el.scopeName ===
uiName: el.localName.indexOf(uiName+”:”) === 0 }

1
2
3
function isWidget(el, uiName){
  return   el.scopeName ? el.scopeName === uiName: el.localName.indexOf(uiName+":") === 0
}

其一难点解决后,大家就可以开搞基于自定义标签的UI库了!

1 赞 1 收藏
评论

澳门葡京 9

1.firefox和IE的自定义标签可以经过以下样式举行联合
<html XMLNS=””
XMLNS:TEST=”//www.jb51.net”>
澳门葡京,2.自定义标签的的定义也得以举办统一
<TEST:mylabel value=”mylabel”/>
<TEST:mylabel value=”mylabel2″></TEST:mylabel>
3.js得到自定义标签的值就有分别了(假使有统一的不二法门,请务必留言)
function f_test(){
var mylabels;
if(IE)//如果是ie
mylabels = document.getElementsByTagName(“mylabel”);
else//如果是FF
mylabels = document.getElementsByTagName(“TEST:mylabel”);
}

1.firefox和IE的自定义标签可以由此以下样式举办联合
<html XMLNS=””
XMLNS:TEST=”;
2.自定义标签的的定义也足以展开联合
<TEST:mylabel value=”mylabel”/>
<TEST:mylabel value=”mylabel2″></TEST:mylabel>
3.js获取自定义标签的值就有分别了(借使有联合的艺术,请务必留言)
function f_test(){
var mylabels;
if(IE)//如果是ie
mylabels = document.getElementsByTagName(“mylabel”);
else//如果是FF
mylabels = document.getElementsByTagName(“TEST:mylabel”);
}

自定义标签类,自定义标签

利用标签可以轮换jsp页面上的本子,让页面越发从简,维护越发有利,扩充程序安全性。

在javaee
api中有一个接口javax.servlet.jsp.tagext.JspTag,它是持有的标签的根接口。

在jsp2.0随后,定义了一个越发简明的javax.servlet.jsp.tagext.SimpleTag,这几个接口就讲述了如何自定义标签。

标签的分类:

  • 历史观标签
  • 简易标签SimpleTag

SimpleTag体系

     SimpleTag有一个贯彻类SimpleTagSupport,自定义标签类一般会持续它。

概念一个标签的步调:

有关SimpleTag接口的方法描述

  • doTag方法它的效果:描述标签的功用 (会被机关调用)
  • setJspContext:它的参数是JspContext,它的意义是将页面的pageContext对象传递到标签类中。(很大用处,用于获取其余八大对象)
  • setJspBody:将标签体的内容缓存到内存对象中,而参数JspFragment
    相当于标签体内容。
  • getParent  setParent 将标签的父标签引入。(基本不用)

 

你或许感兴趣的作品:

  • 在asp.net(C#)中利用自定义标签和XML、XSL突显数据
  • jsp 自定义标签实例
  • JSP自定义标签Taglib落成进度重点总计
  • jsp自定义标签技术(完毕原理与代码以及平台搭建步骤)
  • JSP自定义标签获取用户IP地址的章程
  • jsp不难自定义标签的forEach遍历及转义字符示例
  • ThinkPHP模板自定义标签使用办法
  • ThinkPHP分组下自定义标签库实例
  • JSP自定义标签rtexprvalue属性用法实例分析
  • JSP自定义标签基础知识学习

html XMLNS=””
XMLNS:TEST=”” 2.自定义标签的的概念也足以进…

下边是一个自定义标签类:(用于是一个屡屡打印标签体内容的 java 类)

package online.mytag;

import java.io.IOException;

import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.tagext.SimpleTagSupport;

public class PrintTag extends SimpleTagSupport {

    private int count;   //这里的字段,要在 .tld 文件中使用的话,就必须提供 get/set 方法

    public int getCount() {
        return count;
    }

    public void setCount(int count) {
        this.count = count;
    }
    //打印
    @Override
    public void doTag() throws JspException, IOException {
        String str = getJspBody().toString();
        JspWriter out = getJspContext().getOut();
        for (int i = 0; i < count; i++) {
            out.write(str);
        }
    }
}

相关文章