jQuery中:header選擇器用法實例
本文實例講述了jQuery中header選擇器用法。分享給大家供大家參考。具體分析如下:
此選擇器能夠匹配標題元素,即(h1-h6)。
語法結構:
此選擇器一般也要和其他選擇器配合使用,比如類選擇器和元素選擇器等等。例如:
以上代碼能夠?qū)㈩惷麨閝iantai的標題元素中的字體顏色設置為藍色。
如果不和其他選擇器配合使用,則默認狀態(tài)是和*選擇器配合使用,例如$(":header")等同于$("*:header")。
實例代碼:
實例一:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$(".qiantai:header").css("color","blue");
})
})
</script>
</head>
<body>
<ul>
<h1 class="qiantai">前臺專區(qū)版塊</h1>
<li>html專區(qū)</li>
<li>div+css專區(qū)</li>
<li>jQuery專區(qū)</li>
<li>Javascript專區(qū)</li>
</ul>
<ul>
<h1>后臺專區(qū)版塊</h1>
<li>ASP專區(qū)</li>
<li>php專區(qū)</li>
</ul>
<button id="btn">點擊查看效果</button>
</body>
</html>
以上代碼可以class屬性值為qiantai的標題元素中的文本顏色設置為藍色。
實例二:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$(":header").css("color","blue");
})
})
</script>
</head>
<body>
<ul>
<h1 class="qiantai">前臺專區(qū)版塊</h1>
<li>html專區(qū)</li>
<li>div+css專區(qū)</li>
<li>jQuery專區(qū)</li>
<li>Javascript專區(qū)</li>
</ul>
<ul>
<h1>后臺專區(qū)版塊</h1>
<li>ASP專區(qū)</li>
<li>php專區(qū)</li>
</ul>
<button id="btn">點擊查看效果</button>
</body>
</html>
由于以上代碼并沒有指定與:header選擇器相配合使用的選擇器,所以就默認和*選擇器配合使用,于是以上代碼可以將當前文檔中所有元素中的標題元素的文本顏色設置為藍色。
希望本文所述對大家的jQuery程序設計有所幫助。
- Jquery修改頁面標題title其它JS失效的解決方法
- 讓新消息在網(wǎng)頁標題閃爍提示的jQuery代碼
- 基于jquery插件制作左右按鈕與標題文字圖片切換效果
- Jquery 設置標題的自動翻轉
- jQuery+Ajax實現(xiàn)表格數(shù)據(jù)不同列標題排序(為表格注入活力)
- Jquery創(chuàng)建層顯示標題和內(nèi)容且隨鼠標移動而移動
- jQuery 標題的自動翻轉實現(xiàn)代碼
- 使表格的標題列可左右拉伸jquery插件封裝
- jquery實現(xiàn)點擊彈出帶標題欄的彈出層(從右上角飛入)效果
- jQuery實現(xiàn)點擊標題輸入詳細信息
- jQuery實現(xiàn)獲取h1-h6標題元素值的方法
相關文章
jQuery?獲取與設置元素屬性的詳細方法(看完這篇文章就搞明白了)
這篇文章帶領大家熟練掌握?jQuery?的屬性方面的操作,包括固有屬性的獲取與設置,自定義屬性的獲取與設置等等,走進?jQuery?的更深層次階段,這也是腳本之家小編發(fā)現(xiàn)的一篇比較實用的文章2023-06-06BootStrap下jQuery自動完成的樣式調(diào)整
這篇文章主要介紹了BootStrap下jQuery自動完成的樣式調(diào)整的相關資料,非常不錯具有參考借鑒價值,需要的朋友可以參考下2016-05-05JQuery form表單提交前驗證單選框是否選中、刪除記錄時驗證經(jīng)驗總結(整理)
這篇文章主要介紹了JQuery form表單提交前驗證單選框是否選中、刪除記錄時驗證經(jīng)驗總結,非常不錯,具有參考借鑒價值,需要的朋友參考下吧2017-06-06jquery實現(xiàn)動態(tài)創(chuàng)建form并提交的方法示例
這篇文章主要介紹了jquery實現(xiàn)動態(tài)創(chuàng)建form并提交的方法,結合實例形式分析了jQuery form表單創(chuàng)建與提交相關操作技巧,需要的朋友可以參考下2019-05-05