html5中怎么獲取自定義屬性值

這篇文章給大家分享的是有關(guān)html5中怎么獲取自定義屬性值的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考。一起跟隨小編過來看看吧。

成都創(chuàng)新互聯(lián)專業(yè)為企業(yè)提供王益網(wǎng)站建設(shè)、王益做網(wǎng)站、王益網(wǎng)站設(shè)計(jì)、王益網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)與制作、王益企業(yè)網(wǎng)站模板建站服務(wù)，十年王益做網(wǎng)站經(jīng)驗(yàn)，不只是建網(wǎng)站，更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

自定義屬性：

在HTML5中我們可以自定義屬性，其格式如下data-*=""，例如：data-info="我是自定義屬性"，通過Node.dataset['info'] 我們便可以獲取到自定義的屬性值。

當(dāng)我們?nèi)缦赂袷皆O(shè)置時(shí)，則需要以駝峰格式才能正確獲?。篸ata-my-name="itcast"，獲取Node.dataset['myName']

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--定義-->
<!--規(guī)范：
1.data-開頭
2.data-后必須至少有一個(gè)字符，多個(gè)單詞使用-連接
建議：
1.名稱應(yīng)該都使用小寫--不要包含任何的大寫字符
2.名稱中不要有任何的特殊符號(hào)
3.名稱不要副作用純數(shù)字-->
<p data-school-name="itcast">傳智播客</p>
<p data-name="itcast">傳智播客</p>

<!--取值-->
<script>
    window.onload=function(){
        var p=document.querySelector("p");
        /*獲取自定義屬性值*/
        /*將data-后面的單詞使用camel命名法連接:必須使用camel合法法獲取值否則有可能無法獲取到值*/
        //var value=p.dataset["schoolname"];//data-schoolname    就是相當(dāng)于上面的代碼塊來著同一個(gè)意思來著
        var value=p.dataset["schoolName"];//data-school-name     里面的取值必須第二個(gè)單詞。的第一個(gè)字母必須是大寫字母來著
        console.log(value);
    }
</script>
</body>
</html>

感謝各位的閱讀！關(guān)于html5中怎么獲取自定義屬性值就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！

分享標(biāo)題：html5中怎么獲取自定義屬性值
分享URL：http://bm7419.com/article2/jcgooc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制開發(fā)、網(wǎng)站收錄、關(guān)鍵詞優(yōu)化、建站公司、網(wǎng)站排名、App開發(fā)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容