強大的JQuery(三) 操作html與遍歷

2022-03-04 01:37:54 字數 2120 閱讀 4188

前兩篇部落格講到了jquery的基礎知識以及其動畫效果,本篇將為大家介紹jquery操縱html以及jquery的遍歷。

text() - 設定或返回所選元素的文字內容 

html() - 設定或返回所選元素的內容(包括 html 標記) 

val() - 設定或返回表單字段的值

attr()- 方法用於獲取屬性值。

例項:

$("#btn1").click(function());

$("#btn2").click(function());

$("button").click(function());

例項:

$("#btn1").click(function());

$("#btn2").click(function());

$("#btn3").click(function());

$("button").click(function());

例項:

function aftertext()

remove() - 刪除被選元素(及其子元素) 

empty() - 從被選元素中刪除子元素 

addclass() - 向被選元素新增乙個或多個類 

removeclass() - 從被選元素刪除乙個或多個類 

toggleclass() - 對被選元素進行新增/刪除類的切換操作 

css() - 設定或返回樣式屬性 

舉例:

$("button").click(function());

jquery 遍歷,意為「移動」,用於根據其相對於其他元素的關係來「查詢」(或選取)html 元素。以某項選擇開始,並沿著這個選擇移動,直到抵達您期望的元素為止。

解釋:元素是 的父元素,同時是其中所有內容的祖先。 

元素是 元素的父元素,同時是 的子元素 

左邊的 元素是 的父元素,的子元素,同時是 的後代。 

元素是 的子元素,同時是 和 的後代。 

兩個 元素是同胞(擁有相同的父元素)。 

右邊的 元素是的父元素,的子元素,同時是 的後代。 

元素是右邊的 的子元素,同時是 和 的後代。 

parents() 方法返回被選元素的所有祖先元素,它一路向上直到文件的根元素 ()。

parent() 方法返回被選元素的直接父元素。

parentsuntil() 方法返回介於兩個給定元素之間的所有祖先元素。

舉例

$(document).ready(function());

children() 方法返回被選元素的所有直接子元素。

find() 方法返回被選元素的後代元素,一路向下直到最後乙個後代。

next() 方法返回被選元素的下乙個同胞元素。

nextall() 方法返回被選元素的所有跟隨的同胞元素。

nextuntil() 方法返回介於兩個給定引數之間的所有跟隨的同胞元素

first() 方法返回被選元素的首個元素。

last() 方法返回被選元素的最後乙個元素。

eq() 方法返回被選元素中帶有指定索引號的元素。

filter() 方法允許您規定乙個標準。不匹配這個標準的元素會被從集合中刪除,匹配的元素會被返回。

not() 方法返回不匹配標準的所有元素。

例如

$(document).ready(function());

$(document).ready(function());

$(document).ready(function());

關於jquery遍歷的函式還有很多,我就不一一枚舉了,有興趣的朋友請自行檢視query幫助文件。

要想掌握好一門語言,即使是一門非常簡單的語言,實踐和思考都是必不可少的,jquery強大而簡單,需要我們在以後的工作學習中反覆的運用才能去真正掌握。

jQuery 強大的jq選擇器和基本操作。

上篇對jquery基本知識做了概述,接下來具體說說jq中主要的功能。之說以說其強大 是因為jquery實現了從 css1 到css3 所有的選擇器以及其他常用的選擇器。以下列出實際開發中比較常用的一些選擇器,具體可以去官方文件檢視。符號 名稱 說明用法 id選擇器 btnshow css color...

三 jQuery中的DOM操作

dom簡介 dom document objectmodel文件物件模型,dom是一種與瀏覽器 平台 語言無關的介面,使用該介面可以輕鬆的訪問頁面中所有的標準元件。dom操作的分類 domcore 核心 html dom和css dom jquery中的dom操作 1.查詢節點 查詢元素節點 查詢屬...

jQuery中的DOM操作 三

一 查詢節點 返回jquery物件 選擇器字串 使用jquery函式,裡面引數為選擇器字串,查詢符合條件的bom物件並返回jquery物件 eg div.one span first 查詢所有類名為one的div裡面的所有後代span裡面的第乙個span元素 二 建立節點 html文字字串 使用jq...