欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

html自定义标签和属性

程序员文章站 2022-06-09 11:09:41
...

html如何支持标签自定义

<!DOCTYPE html>
<!-- 第一步:必需设置<html>标签的xmlns命名空间 -->
<html xmlns:mine>
    <head>
        <meta charset="UTF-8">
        <title>自定义标签</title>
        <style>
            /* 第三步: 自定义标签在设置样式的时候使用 " 命名空间名\:标签名  "    */
            mine\:tag {
                font-size: .36rem;
                font-weight: bold;
                color: red;
            }
            p {
                font-size: 25px;
                color: chocolate;
            }
        </style>
    </head>
    <body>
	    <p>this is normal text</p>
	    <!-- 第二步: 自定义标签需要带命名空间名 " 命名空间名:标签名 " -->
	    <mine:tag>this is custom text</mine:tag>
    </body>
</html>

标签如何设置自定义属性

① js 操作

var element = document.getElementById("Box");
// 读取
element .getAttribute("属性名");
element .attributes["属性名"].nodeValue;
// 设置
element .setAttribute("属性名","值");
element .attributes["属性名"].nodeValue = "值";

② juqery 操作

// 获取值
$("img").attr("src");
// 设置值
$("img").attr("src","1.jpg");
// 设置多个值
$("img").attr({ src: "1.jpg", alt: "我是alt" });
// 把src属性的值设置为title属性的值
$("img").attr("title", function() { return this.src })