xml可以html标签吗,自定义html标签(XML)

HTML和HTML5都可以自定义标签。在浏览一些网站的源代码后，你会发现一些网页中存在你不认识的标签和元素，但是这些元素却能被浏览器执行。这就是自定义元素。

自由定义标签而不必使用预定义好的语义标签之后，更能语义化我们的内容。

在HTML5之前，文档的开头都是这样标记的。

html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

而HTML5中文档的标记是这样的。

这就会导致一些新增的h5元素header、footer，测试过发现IE不能解析h5新增的元素。但是我们给这些元素添加一些样式，却能被浏览器解析。

组件是 Web 开发的方向，现在的热点是 JavaScript 组件，但是 HTML 组件未来可能更有希望。

浏览器处理

我们一般都使用标准的 HTML 元素。

面代码中，

就是标准的 HTML 元素。

如果使用非标准的自定义元素，会有什么结果？

Hello World

上面代码中，就是非标准元素，浏览器不认识它。这段代码的运行结果是，浏览器照常显示Hello World，这说明浏览器并没有过滤这个元素。

现在，为自定义元素加上样式。

greeting {

display: block;

font-size: 36px;

color: red;

}

运行结果如下

接着，使用脚本操作这个元素。

function customTag(tagName, fn){

Array

.from(document.getElementsByTagName(tagName))

.forEach(fn);

}

function greetingHandler(element) {

element.innerHTML = '你好，世界';

customTag('greeting', greetingHandler);

结果如下

这说明，浏览器对待自定义元素，就像对待标准元素一样，只是没有默认的样式和行为。这种处理方式是写入

HTML5 标准的

由上面的测试结果可以得知，自定义标签可以正常显示，可以使用css样式，可以由JavaScript脚本控制

事实上，浏览器提供了一个HTMLUnknownElement对象，所有自定义元素都是该对象的实例。

ar tabs = document.createElement('tabs');

tabs instanceof HTMLUnknownElement // true

tabs instanceof HTMLElement // true

上面代码中，tabs是一个自定义元素，同时继承了HTMLUnknownElement和HTMLElement接口。

import HTML

有了自定义元素，就可以写出语义性非常好的 HTML 代码。

上面的代码，一眼就能看出语义。

如果将元素的样式与脚本，封装在一个 HTML 文件share-buttons.html之中，这个元素就可以复用了。

使用的时候，先引入share-buttons.html。

然后，就可以在网页中使用了。

Title

... ...

xml可以html标签吗,自定义html标签(XML)相关推荐

django-DIL模板自定义过滤器，自定义标签，自定义包含标签
django-DIL模板自定义过滤器,自定义标签,自定义包含标签自定义过滤器 DTL模板语言生来只是为了方便的展示信息,所以与编程语言相比显得有点薄弱,有时候不能满足我们的需求.因此django提供 ...
java自定义jsp标签_Javaweb自定义jsp标签
自定义标签用户定义的一种自定义的jsp标记,当一个含有自定义标签的jsp页面被jsp引擎编译成Servlet时,tag标签被转化成了对一个称为标签处理类的对象的操作.于是当jsp页面被jsp引擎转化 ...
java自定义分页标签_自定义分页标签--仿javaeye分页效果
效果如图: 1.JSP规范1.1版本后增加了自定义标签库.实现自定义标签的步骤 (1)开发自定义标签处理类. (2)建立*.tld文件. (3)在web.xml中增加自定义标签的定义. (4)在jsp ...
2011级-csdn-java-张侃—自定义JSP标签（一）
自定义JSP标签概述 • 自定义JSP标签就是程序员定义的一种JSP标签,这种标签把那些信息显示逻辑封装在一个单独的Java类中,通过一个XML文件来描述它的使用.当页面中需要使用类似 ...
java自定义jsp标签_深入浅出javaWeb实战第17讲自定义JSP标签(上)
<JavaWeb开发>课程计划表 Web的概念及其演变课程内容: ? Web的概念.特点 ? HTTP协议简介 ? Web技术的发展:静态文档,Web应用,Web服务 JavaWeb应用 ...
自定义EL函数、自定义JSTL标签
自定义EL函数 1.做一个类(静态) package com.maya.el;public class ELBiaoDaoShi {public static String TiHuan(String ...
代码与html混合,自定义的标签与html的标签混合应用_css
源码是某书提供的,先看一个例子: 非常家庭北条司3 直接定义名字空间,然后全部采用xml前缀标识格式把自定义标签混插在html代码中. 使用css对自定义标签进行控制的方法: @media all ...
JSP→JSTL标准标签库简介与环境搭建、JSTL助手EL表达式EL隐式对象、标签→out、set、if、多选择配合、foreach、redirect、格式化、JSTL函数标签、自定义标签、标签类架构
JSTL标准标签库简介与环境搭建 EL表达式与EL隐式对象 out标签 set标签 remove标签 catch标签 if标签 choose.when.otherwise配合标签 foreach标签 ...
java 自定义标签_Java自定义标签用法实例分析
本文实例讲述了Java自定义标签用法.分享给大家供大家参考,具体如下: 简单例子实现一个标签分为两步:(1)继承SimpleTagSupport或TagSupport实现一个控制器(2)创建一个描述 ...

xml可以html标签吗,自定义html标签(XML)

xml可以html标签吗,自定义html标签(XML)相关推荐

最新文章

热门文章