JavaScript+jQuery交互式Web前端開發(fā)（第2版） 課件 第9、10章 jQuery（上）（下）_第1頁
JavaScript+jQuery交互式Web前端開發(fā)（第2版） 課件 第9、10章 jQuery（上）（下）_第2頁
JavaScript+jQuery交互式Web前端開發(fā)（第2版） 課件 第9、10章 jQuery（上）（下）_第3頁
JavaScript+jQuery交互式Web前端開發(fā)（第2版） 課件 第9、10章 jQuery（上）（下）_第4頁
JavaScript+jQuery交互式Web前端開發(fā)（第2版） 課件 第9、10章 jQuery（上）（下）_第5頁
已閱讀5頁，還剩173頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權，請進行舉報或認領

文檔簡介

第9章jQuery（上）《JavaScript+jQuery交互式Web前端開發(fā)（第2版）》學習目標/Target

了解什么是jQuery，能夠描述jQuery的特點

掌握jQuery的下載和引入，能夠獨立完成jQuery的下載并且能夠使用兩種方式

引入jQuery

掌握jQuery的簡單使用，能夠使用jQuery實現(xiàn)簡單的頁面效果熟悉jQuery對象，能夠區(qū)別jQuery對象和DOM對象學習目標/Target掌握jQuery選擇器的使用，能夠根據(jù)不同場景使用不同的jQuery選擇器獲取元素

掌握jQuery內(nèi)容操作，能夠靈活應用jQuery中操作元素內(nèi)容的方法

掌握jQuery樣式操作，能夠根據(jù)不同場景使用jQuery實現(xiàn)元素的樣式操作

掌握jQuery屬性操作，能夠靈活應用prop()方法、attr()方法和data()方法操作

元素的屬性章節(jié)概述/SummaryjQuery提供了許多簡化DOM操作、事件處理、動畫效果等常見任務的方法和函數(shù)。通過使用jQuery，可以快速地開發(fā)交互性更強的網(wǎng)頁和Web應用程序，減少冗余的代碼，解決瀏覽器兼容問題。因此，學習和掌握jQuery具有重要的價值。jQuery的知識內(nèi)容較多，本章首先對jQuery的上半部分內(nèi)容進行講解。目錄/Contents9.19.29.3初識jQueryjQuery選擇器jQuery內(nèi)容操作9.4jQuery樣式操作9.5jQuery屬性操作初識jQuery9.1了解什么是jQuery，能夠描述jQuery的特點

先定一個小目標！9.1.1什么是jQuery9.1.1什么是jQueryjQuery是一款快速、簡潔、開源、輕量級的JavaScript庫，它的設計宗旨是“writeless,domore”（使用更少的代碼，做更多的事情）。jQuery具有以下6個特點。9.1.1什么是jQuery代碼可讀性強。語法簡潔易懂，文檔豐富。支持CSS1~CSS3定義的屬性和選擇器。支持事件、樣式、動畫和Ajax操作。可跨瀏覽器，支持的瀏覽器包括IE、Firefox和Chrome等?？蓴U展性強，插件豐富，可以通過插件擴展更多功能。目前jQuery有3個系列的版本，分別是jQuery1.x、jQuery2.x和jQuery3.x系列的版本。它們的區(qū)別在于，jQuery1.x系列的版本保持了對早期版本的IE瀏覽器的支持；jQuery2.x系列的版本不兼容IE6~IE8瀏覽器，從而更加輕量化；jQuery3.x系列的版本不兼容IE6~IE8瀏覽器，此系列的版本增加了一些新方法，并對一些方法進行了優(yōu)化和改進。9.1.1什么是jQuery掌握jQuery的下載和引入，能夠獨立完成jQuery的下載并且能夠使用兩種方式引入jQuery

先定一個小目標！9.1.2下載和引入jQuery在學習使用jQuery之前，需要下載和引入jQuery，具體操作步驟如下。9.1.2下載和引入jQuery在Chrome瀏覽器中訪問jQuery的下載頁面，如下圖所示。9.1.2下載和引入jQuery在jQuery的下載頁面，單擊“jQuery3.6.4”的“minified”鏈接，彈出“CodeIntegration”對話框，如下圖所示。9.1.2下載和引入jQuery引入jQuery。引入方式有兩種，第1種方式是將“CodeIntegration”對話框中的整個<script>標簽的代碼復制到頁面文件中使用。整個<script>標簽的具體代碼如下。<scriptsrc="/jquery-3.6.4.min.js"integrity="sha256-oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl+cbzUq8="crossorigin="anonymous"></script>9.1.2下載和引入jQuery第2種方式是復制“CodeIntegration”對話框中的地址“/jquery-3.6.4.min.js”，并在瀏覽器中訪問該地址，將“jquery-3.6.4.min.js”文件保存到計算中，然后在程序中手動引入jQuery。引入jQuery的示例代碼如下。<scriptsrc="jquery-3.6.4.min.js"></script>上述示例代碼表示引入當前目錄下的jQuery-3.6.4.min.js文件。掌握jQuery的簡單使用，能夠使用jQuery實現(xiàn)簡單的頁面效果9.1.3 jQuery的簡單使用

先定一個小目標！在使用jQuery時可以分為3個步驟，具體如下。9.1.3 jQuery的簡單使用在程序中引入jQuery文件。獲取需要操作的元素。調(diào)用操作方法，例如調(diào)用hide()方法將元素隱藏。下面通過代碼演示jQuery的簡單使用，首先定義一個<div>標簽，并使用jQuery獲取元素，然后將元素在頁面中隱藏，示例代碼如下。9.1.3 jQuery的簡單使用<head>

<scriptsrc="jquery-3.6.4.min.js"></script></head><body>

<div>HellojQuery</div>

<script>

$('div').hide();

//隱藏div元素

</script></body>熟悉jQuery對象，能夠區(qū)別jQuery對象和DOM對象9.1.4 jQuery對象

先定一個小目標！在頁面中引入jQuery后，全局作用域下會新增兩個變量，分別是$和jQuery，這兩個變量引用的是同一個對象，該對象稱為jQuery頂級對象。為了方便書寫，通常使用$變量。下面通過代碼演示$變量和jQuery變量的使用。//$變量的使用$('div').hide();//jQuery變量的使用jQuery('div').hide();9.1.4 jQuery對象jQuery頂級對象類似構造函數(shù)，用于創(chuàng)建jQuery實例對象（簡稱jQuery對象），但它不需要使用new關鍵字，它的內(nèi)部會自動進行實例化，然后它會返回實例化后的對象。jQuery對象的本質是jQuery頂級對象對DOM對象包裝后產(chǎn)生的對象。9.1.4 jQuery對象9.1.4 jQuery對象jQuery對象以類數(shù)組的形式存儲，它可以包裝一個或多個DOM對象。下面通過代碼對比jQuery對象和DOM對象。<body>

<div>HellojQuery</div>

<script>

//jQuery對象

vardiv1=$('div');

console.log(div1);

//DOM對象

vardiv2=document.getElementsByTagName('div');

console.log(div2);

</script></body>9.1.4 jQuery對象前面的示例代碼運行后，jQuery對象和DOM對象的輸出結果如下圖所示。在實際開發(fā)中，經(jīng)常會在jQuery對象和DOM對象之間進行轉換，由于DOM對象比jQuery對象更復雜，DOM對象的一些屬性和方法在jQuery對象中沒有封裝，所以使用這些屬性和方法時需要把jQuery對象轉化為DOM對象。另外，DOM對象也可以轉換為jQuery對象。9.1.4 jQuery對象9.1.4 jQuery對象1.將jQuery對象轉換為DOM對象將jQuery對象轉換為DOM對象有兩種實現(xiàn)方式，第1種實現(xiàn)方式的語法格式如下。jQuery對象[索引]第2種實現(xiàn)方式的語法格式如下。jQuery對象.get(索引)9.1.4 jQuery對象將jQuery對象轉換為DOM對象的示例代碼如下。vardiv1=$('div')[0]; //第1種實現(xiàn)方式vardiv2=$('div').get(0); //第2種實現(xiàn)方式上述示例代碼分別使用兩種方式將jQuery對象轉換為DOM對象，當jQuery對象轉換為DOM對象后就可以使用DOM方式操作元素。9.1.4 jQuery對象2.將DOM對象轉換為jQuery對象將DOM對象轉換為jQuery對象的語法格式如下。$(DOM對象)將DOM對象轉換為jQuery對象的示例代碼如下。//獲取DOM對象vardiv=document.getElementByTagName('div')[0];//將DOM對象轉換成jQuery對象div=$(div);jQuery選擇器9.2掌握基本選擇器的使用，能夠靈活應用基本選擇器獲取元素9.2.1 基本選擇器

先定一個小目標！jQuery提供了類似CSS選擇器的機制，使用選擇器可以很方便地獲取元素，使用jQuery選擇器獲取元素的語法格式如下。$(selector)9.2.1 基本選擇器上述語法格式中，selector表示選擇器。下面列舉jQuery中常用的基本選擇器，具體如下表所示。選擇器功能描述示例#id獲取指定id的元素$('#btn')獲取id為btn的元素*匹配所有元素$('*')獲取頁面中的所有元素.class獲取同一class的元素$('.tab')獲取所有class為tab的元素element獲取相同標簽名的所有元素$('div')獲取所有div元素selector1,selector2,…同時獲取多個元素$('div,p,li')同時獲取div元素、p元素和li元素9.2.1 基本選擇器下面通過代碼進行演示。<divclass="fruit">蘋果</div><script>console.log($('.fruit'));</script>9.2.1 基本選擇器

先定一個小目標！9.2.2 層次選擇器掌握層次選擇器的使用，能夠靈活應用層次選擇器獲取元素在實際開發(fā)中，當需要獲取某個元素的子元素、后代元素或兄弟元素時，可以使用jQuery的層次選擇器。在jQuery中可以通過一些指定符號（如“>”、空格、“+”和“~”）完成多層次元素之間的獲取。9.2.2 層次選擇器下面列舉jQuery中常用的層次選擇器，具體如下表所示。選擇器功能描述示例parent>child獲取所有子元素$('ul>li')獲取ul元素下的所有l(wèi)i子元素selectorselector1獲取所有后代元素$('ulli')獲取ul元素下的所有l(wèi)i后代元素prev+next獲取后面緊鄰的兄弟元素$('div+.title')獲取div元素后面緊鄰的class為title的兄弟元素prev~siblings獲取后面的所有兄弟元素$('.bar~li')獲取class為bar的元素后的所有l(wèi)i兄弟元素9.2.2 層次選擇器下面通過代碼進行演示。<ul><li>第1個li元素</li><li>第2個li元素</li></ul><script>console.log($('ulli')); //獲取ul中的li</script>9.2.2 層次選擇器

先定一個小目標！9.2.3 篩選選擇器掌握篩選選擇器的使用，能夠靈活應用篩選選擇器獲取元素在實際開發(fā)中，若需要對獲取到的元素進行篩選，例如獲取指定選擇器中的第一個或最后一個元素，就可以使用jQuery的篩選選擇器完成。9.2.3 篩選選擇器下面列舉jQuery中常用的篩選選擇器，具體如下表所示。選擇器功能描述示例:first獲取指定選擇器中的第一個元素$('li:first')獲取第一個li元素:last獲取指定選擇器中的最后一個元素$('li:last')獲取最后一個li元素:eq(index)獲取索引等于index的元素（索引從0開始）$('li:eq(2)')獲取索引為2的li元素:gt(index)獲取索引大于index的元素$('li:gt(3)')獲取索引大于3的所有l(wèi)i元素:lt(index)獲取索引小于index的元素$('li:lt(3)')獲取索引小于3的所有l(wèi)i元素:even獲取索引為偶數(shù)的元素$('li:even')獲取索引為偶數(shù)的li元素9.2.3 篩選選擇器>>續(xù)上一頁表9.2.3 篩選選擇器選擇器功能描述示例:odd獲取索引為奇數(shù)的元素$('li:odd')獲取索引為奇數(shù)的li元素:not(seletor)獲取除指定的選擇器之外的其他元素$('li:not(li:eq(3))')獲取除索引為3的li元素之外的所有l(wèi)i元素:focus獲取當前獲得焦點的元素$('input:focus')獲取當前獲得焦點的input元素:animated獲取所有正在運行動畫效果的元素$('div:animated')獲取當前正在運行動畫效果的div元素:target選擇由文檔URL的格式化識別碼表示的目標元素若URL為http://localhost/#foo，則$('div:target')將獲取id為foo的div元素:contains(text)獲取內(nèi)容包含text的元素$('li:contains(js)')獲取內(nèi)容中包含js的li元素選擇器功能描述示例:empty獲取內(nèi)容為空的元素$('li:empty')獲取內(nèi)容為空的li元素:has(selector)獲取內(nèi)容包含指定選擇器的元素$("li:has('a')")獲取內(nèi)容中包含a元素的所有l(wèi)i元素:parent獲取帶有子元素或包含文本的元素$('li:parent')獲取帶有子元素或包含文本的li元素:hidden獲取所有隱藏元素$('li:hidden')獲取所有隱藏的li元素:visible獲取所有可見元素$('li:visible')獲取所有可見的li元素9.2.3 篩選選擇器>>續(xù)上一頁表下面通過代碼進行演示。<ul><li>第1個li元素，索引為0</li><li>第2個li元素，索引為1</li><li>第3個li元素，索引為2</li></ul><script>$('ulli:first').css('color','red');$('ulli:eq(2)').css('color','blue');</script>9.2.3 篩選選擇器前面的示例代碼運行后，使用了篩選選擇器的輸出結果如下圖所示。9.2.3 篩選選擇器

先定一個小目標！9.2.4 其他選擇器掌握其他選擇器的使用，能夠靈活應用其他選擇器獲取元素在jQuery中，選擇器的種類非常多，除了前面介紹的基本選擇器、層次選擇器和篩選選擇器外，在開發(fā)中還可能會用到其他選擇器，如屬性選擇器、子元素選擇器和表單選擇器。9.2.4 其他選擇器1.屬性選擇器jQuery中提供了根據(jù)元素的屬性獲取指定元素的選擇器，即屬性選擇器。常用的屬性選擇器如下表所示。9.2.4 其他選擇器選擇器功能描述示例[attr]獲取具有指定屬性的元素$('div[class]')獲取含有class屬性的所有div元素[attr=value]獲取屬性值等于value的元素$('div[class=current]')獲取class屬性值等于current的所有div元素[attr!=value]獲取屬性值不等于value的元素$('div[class!=current]')獲取class屬性值不等于current的所有div元素[attr^=value]獲取屬性值以value開始的元素$('div[class^=box]')獲取class屬性值以box開始的所有div元素>>續(xù)上一頁表9.2.4 其他選擇器選擇器功能描述示例[attr$=value]獲取屬性值以value結尾的元素$('div[class$=er]')獲取class屬性值以er結尾的所有div元素[attr*=value]獲取屬性值包含value的元素$("div[class*='-']")獲取class屬性值中含有“-”符號的所有div元素[attr~=value]獲取屬性值包含value或以空格分隔并包含value的元素$("div[class~='box']")獲取class屬性值等于“box”或通過空格分隔并含有box的div元素，如“abox”[attr1][attr2]…獲取同時擁有多個屬性的元素$("input[id][name$='usr']")獲取同時含有id屬性和屬性值以usr結尾的name屬性的input元素2.子元素選擇器在開發(fā)過程中，若需要通過子元素獲取元素，可以使用jQuery提供的子元素選擇器。常用的子元素選擇器如下表所示。9.2.4 其他選擇器選擇器功能描述示例:nth-child(數(shù)字/even/odd/公式)按數(shù)字、奇數(shù)、偶數(shù)或公式獲取元素$('ulli:nth-child(3)')獲取所有ul中的第3個li元素:first-child獲取第一個子元素$('ulli:first-child')獲取所有ul中的第一個li元素:last-child獲取最后一子元素$('ulli:last-child')獲取所有ul中的最后一個li元素:only-child如果當前元素是父元素唯一的子元素，則獲取$('ulli:only-child')如果當前l(fā)i元素是ul唯一的子元素，則獲取:nth-last-child(數(shù)字/even/odd/公式)按指定條件獲取相同父元素中的子元素，計數(shù)從最后一個元素開始到第一個$('ulli:nth-last-child(2)')獲取所有ul中的最后2個li元素9.2.4 其他選擇器選擇器功能描述示例:nth-of-type(數(shù)字/even/odd/公式)按指定條件獲取相同父元素中的同類子元素$('span:nth-of-type(2)')獲取span類型元素中的第2個子元素:first-of-type獲取同類元素中的第一個子元素$('span:first-of-type')獲取span類型元素中的第一個子元素:last-of-type獲取同類元素中的最后一個子元素$('span:last-of-type')獲取span類型元素中的最后一個子元素:only-of-type獲取沒有兄弟元素的同類子元素$('span:only-of-type')獲取沒有兄弟元素的span類型子元素:nth-last-of-type(數(shù)字/even/odd/公式)按指定條件獲取相同父元素下的同類子元素，計數(shù)從最后一個元素開始到第一個$('span:nth-last-of-type(2)')獲取span類型的最后2個子元素>>續(xù)上一頁表3.表單選擇器在開發(fā)過程中，若需要對表單進行操作，可以使用jQuery提供的表單選擇器獲取表單元素。常用的表單選擇器如下表所示。9.2.4 其他選擇器選擇器功能描述示例:input獲取頁面中的所有表單元素，包括select元素以及textarea元素$('input:input')獲取頁面中的所有表單元素:text獲取所有的文本框$('input:text')獲取所有的文本框:password獲取所有的密碼框$('input:password')獲取所有的密碼框:radio獲取所有的單選按鈕$('input:radio')獲取所有的單選按鈕:checkbox獲取所有的復選框$('input:checkbox')獲取所有的復選框9.2.4 其他選擇器選擇器功能描述示例:submit獲取提交按鈕$('input:submit')獲取提交按鈕:reset獲取重置按鈕$('input:reset')獲取重置按鈕:image獲取圖像域，即<inputtype="image">$('input:image')獲取圖像域:button獲取所有按鈕，包括<button>和<inputtype="button">$('input:button')獲取所有按鈕:file獲取文件域，即<inputtype="file">$('input:file')獲取文件域>>續(xù)上一頁表9.2.4 其他選擇器選擇器功能描述示例:hidden獲取表單隱藏項$('input:hidden')獲取表單隱藏項:enabled獲取所有可用表單元素$('input:enabled')獲取所有可用表單元素:disabled獲取所有不可用表單元素$('input:disabled')獲取所有不可用表單元素:checked獲取所有選中的表單元素，主要針對radio元素和checkbox元素$(':checked')獲取所有被選中的表單元素:selected獲取所有選中的表單元素，主要針對select元素$('selected')獲取所有選中的表單元素>>續(xù)上一頁表jQuery內(nèi)容操作9.3掌握jQuery內(nèi)容操作，能夠靈活應用jQuery中操作元素內(nèi)容的方法

先定一個小目標！9.3jQuery內(nèi)容操作9.3jQuery內(nèi)容操作jQuery提供了多個方法用于操作元素的HTML內(nèi)容和文本內(nèi)容。在網(wǎng)頁開發(fā)中，若需要獲取或設置元素的HTML內(nèi)容，可以使用html()方法實現(xiàn)；若需要獲取或設置元素的文本內(nèi)容，可以使用text()方法實現(xiàn)；若需要獲取或設置表單元素的value值，可以使用val()方法實現(xiàn)。下面列舉jQuery中元素內(nèi)容操作的方法，具體如下表所示。選擇器功能描述示例html()獲取第1個匹配元素的HTML內(nèi)容html()html(htmlString)設置所有匹配元素的HTML內(nèi)容為htmlStringhtml(htmlString)text()獲取所有匹配元素包含的文本內(nèi)容組合起來的文本text()text(text)設置所有匹配元素的文本內(nèi)容為texttext(text)val()獲取表單元素的value值val()val(value)設置表單元素的value值val(value)9.3jQuery內(nèi)容操作當需要獲取內(nèi)容的元素是select時，val()方法的返回結果是一個包含所選值的數(shù)組；當需要為表單元素設置選中情況時，可以為val()方法傳遞數(shù)組參數(shù)。9.3jQuery內(nèi)容操作jQuery樣式操作9.4掌握css()方法的使用，能夠靈活應用css()方法操作元素的樣式

先定一個小目標！9.4.1 css()方法操作元素的樣式9.4.1 css()方法操作元素的樣式使用jQuery提供的css()方法可以獲取元素的樣式和設置元素的樣式。css()方法的具體用法和說明如下表所示。方法說明css(propertyName)獲取第一個匹配元素的樣式css(propertyName,value)為所有匹配的元素設置樣式css(properties)將一個鍵值對形式的對象properties設置為所有匹配元素的樣式9.4.1 css()方法操作元素的樣式在css()方法的參數(shù)中：propertyName是一個字符串，表示樣式屬性名。value表示樣式屬性值。properties表示樣式對象，如{color:'red'}。需要注意的是，當css()方法接收對象作為參數(shù)時，如果屬性名由兩個單詞組成，需要將CSS屬性名中的“-”去掉，并將第2個單詞首字母大寫，例如，設置元素的backgroud-color樣式屬性時，需要將屬性名修改為backgroudColor。下面通過代碼演示如何使用css()方法操作元素的樣式。首先定義一個<div>標簽，并設置其寬度為100px，高度為100px，背景顏色為blue，然后使用css()方法將<div>標簽的寬度設置為200px，高度為200px，背景顏色為pink。9.4.1 css()方法操作元素的樣式

先定一個小目標！9.4.2 操作元素樣式類掌握操作元素樣式類，能夠靈活應用操作元素樣式類的方法9.4.2 操作元素樣式類在網(wǎng)頁開發(fā)中不僅可以使用類操作元素的樣式，即定義class，還可以通過jQuery操作元素樣式類。下面列舉操作元素樣式類的方法，具體如下表所示。用法說明addClass(className)為每個匹配的元素追加指定類名的樣式removeClass(className)從所有匹配的元素中刪除全部或者指定的類toggleClass(className)判斷指定類是否存在，存在則刪除，不存在則添加下面通過代碼進行演示。首先定義1個<div>標簽和3個類，這3個類分別為first、second和third，再使用addClass()方法為<div>標簽添加first類和second類，然后使用removeClass()方法刪除<div>標簽中的first類，最后使用toggleClass()方法判斷<div>標簽中是否存在third類，若存在則刪除該類，否則添加該類。9.4.2 操作元素樣式類9.4.2 操作元素樣式類操作元素樣式的運行結果如下圖所示。jQuery屬性操作9.5掌握prop()方法的使用，能夠應用prop()方法操作元素的屬性

先定一個小目標！9.5.1 prop()方法9.5.1 prop()方法prop()方法用于獲取或設置元素的屬性值，該方法的語法格式如下。$(selector).prop(propertyName,value)上述語法格式中，selector表示選擇器，propertyName表示屬性名，value表示屬性值。如果只傳遞propertyName參數(shù)，則表示獲取對應元素的屬性值；如果傳遞了value參數(shù)，表示設置對應元素的屬性值。9.5.1 prop()方法下面通過代碼進行演示。<body>

<ahref="http://localhost"title="與時俱進"></a>

<script>

console.log($('a').prop('href'));//輸出結果為：http://localhost/

$('a').prop('title','實事求是');

</script></body>9.5.1 prop()方法下面演示如何使用prop()方法獲取表單元素的checked值。<body>

<labelfor="myCheckbox">選擇：

<inputtype="checkbox"id="myCheckbox"checked>

</label>

<script>

varisChecked=$('#myCheckbox').prop('checked');

console.log(isChecked);

</script></body>掌握attr()方法的使用，能夠應用attr()方法獲取或設置標簽的屬性值

先定一個小目標！9.5.2 attr()方法attr()方法用于獲取或設置標簽的屬性值，例如，給div元素添加index屬性，保存元素的索引。attr()方法的語法格式如下。$(selector).attr(propertyName,value)上述語法格式中，selector表示選擇器，propertyName表示屬性名，value表示屬性值。如果只傳遞propertyName參數(shù)，則表示獲取對應標簽的屬性值；如果傳遞了value參數(shù)，表示設置對應標簽的屬性值。9.5.2 attr()方法如果只傳遞propertyName參數(shù)，則表示獲取對應元素的屬性值。下面通過代碼進行演示。<body>

<divindex="1"data-index="2">div元素</div>

<script>

console.log($('div').attr('index'));

//輸出結果為：1

console.log($('div').attr('data-index'));

//輸出結果為：2

$('div').attr('index',3); //設置index的屬性值為3

$('div').attr('data-index',4);

//設置data-index的屬性值為4

</script></body>9.5.2 attr()方法掌握data()方法的使用，能夠應用data()方法獲取或設置數(shù)據(jù)

先定一個小目標！9.5.3 data()方法data()方法用于在指定的元素上獲取或設置數(shù)據(jù)，該方法的語法格式如下。$(selector).data(name,value)上述語法格式中，selector表示選擇器，name表示數(shù)據(jù)名，value表示數(shù)據(jù)值。如果只傳遞name參數(shù)，則表示獲取對應元素上的數(shù)據(jù)；如果傳遞了value參數(shù)，表示設置對應元素上的數(shù)據(jù)。9.5.3 data()方法下面通過代碼進行演示。<body>

<div>div元素</div>

<script>

$('div').data('userName','小智');

//設置數(shù)據(jù)

console.log($('div').data('userName')); //獲取數(shù)據(jù)，輸出結果為：小智

</script></body>9.5.3 data()方法data()方法不僅可以在指定的元素上獲取或設置數(shù)據(jù)，而且可以讀取HTML5自定義屬性data-index，示例代碼如下。<body><divindex="1"data-index="2">div元素</div>

<script>

console.log($('div').data('index'));

//輸出結果為：2

</script></body>9.5.3 data()方法本章小結本章主要對jQuery的上半部分內(nèi)容進行講解，首先講解了什么是jQuery、下載和引入jQuery、jQuery的簡單使用和jQuery對象，然后講解了jQuery選擇器，包括基本選擇器、層次選擇器、篩選選擇器和其他選擇器，最后講解了jQuery內(nèi)容操作、樣式操作和屬性操作。通過本章的學習，讀者能夠運用jQuery開發(fā)常見的網(wǎng)頁交互功能。本章小結第10章jQuery（下）《JavaScript+jQuery交互式Web前端開發(fā)（第2版）》學習目標/Target

掌握jQuery元素操作，能夠實現(xiàn)元素的遍歷、查找、過濾、追加、復制、替換

和刪除操作

掌握jQuery尺寸和位置操作，能夠靈活應用尺寸和位置操作方法獲取或設置元

素的尺寸、位置

掌握jQuery事件操作，能夠根據(jù)實際場景完成事件注冊、觸發(fā)、委托等操作

掌握jQuery動畫，能夠根據(jù)不同場景使用jQuery實現(xiàn)元素的顯示、隱藏、滑動、

停止、淡入淡出和自定義動畫的效果

了解jQuery其他方法，能夠描述$.extend()方法和$.ajax()方法的作用章節(jié)概述/Summary第9章講解了jQuery的基本使用，相信讀者已經(jīng)掌握了使用jQuery開發(fā)常見網(wǎng)頁交互功能的技能。在jQuery中還提供了元素操作、尺寸和位置操作、事件操作、動畫等方法，使用這些方法可以高效地開發(fā)更豐富的網(wǎng)頁交互功能。本章將對jQuery（下）進行講解。目錄/Contents10.110.2jQuery元素操作jQuery尺寸和位置操作10.3jQuery事件操作目錄/Contents10.410.5jQuery動畫jQuery其他方法10.6【案例】使用jQuery實現(xiàn)購物車功能jQuery元素操作10.1掌握元素遍歷操作，能夠使用each()方法實現(xiàn)元素遍歷操作

先定一個小目標！10.1.1元素遍歷操作在jQuery中，當需要對多個元素進行相同的操作時，可以使用元素遍歷操作，從而減少代碼量。jQuery提供了each()方法用于快速實現(xiàn)元素遍歷操作，each()方法的語法格式如下。$(selector).each(function(index,domEle)){//具體操作});在上述語法格式中，selector表示選擇器，each()方法的參數(shù)是一個函數(shù)，該函數(shù)用于遍歷匹配的元素集合中的每個元素，函數(shù)的index參數(shù)表示元素的索引，domEle參數(shù)表示DOM元素對象。10.1.1元素遍歷操作$.each()方法可以遍歷任何對象，包括數(shù)組。$.each()方法的語法格式如下。$.each(collection,function(index,element)){//具體操作});上述語法格式中，collection表示被遍歷的對象，index表示數(shù)組元素索引或對象成員名，element表示數(shù)組元素值或對象成員值。10.1.1元素遍歷操作$.each()方法多學一招掌握元素查找和過濾操作，能夠靈活應用jQuery中常用的元素查找方法和過濾方法10.1.2元素查找和過濾操作

先定一個小目標！在前面的學習中，已經(jīng)了解了如何使用jQuery的選擇器獲取滿足某個條件的元素，jQuery還提供了一些查找和過濾元素的方法，用于快速獲取元素。10.1.2元素查找和過濾操作下面列舉jQuery中常用的元素查找方法和過濾方法，具體如下表所示。分類方法說明查找元素find(selector|ele)獲取當前匹配元素集中每個元素的后代元素，通過選擇器selector或元素ele過濾parents([selector])獲取當前匹配元素集中每個元素的祖先元素（不包含根元素）parent([selector])獲取當前匹配元素集中每個元素的父元素siblings([selector])獲取當前匹配元素集中每個元素的兄弟元素（不分前后）next([selector])獲取當前匹配元素集中每個元素緊鄰的后一個兄弟元素prev([selector])獲取當前匹配元素集中每個元素緊鄰的前一個兄弟元素10.1.2元素查找和過濾操作>>續(xù)上一頁表分類方法說明過濾元素eq(index)獲取索引index對應的元素filter(selector|obj|ele|fn)使用選擇器selector、對象obj、元素ele或函數(shù)fn完成指定元素的篩選hasClass(class)檢查當前的元素是否含有某個特定的類，如果有，則返回true，否則返回falseis(selector|obj|ele|fn)根據(jù)選擇器selector、對象obj、元素ele或函數(shù)fn檢查當前匹配的一組元素，如果這些元素中至少有一個與給定的參數(shù)匹配，則返回truehas(selector|ele)保留包含特定后代元素的元素，去掉不含有特定后代元素的元素10.1.2元素查找和過濾操作掌握精品展示的案例，能夠編寫代碼實現(xiàn)案例

先定一個小目標！10.1.3【案例】精品展示在電商網(wǎng)站的首頁設計中，通常會有精品展示的功能，該功能用于推送熱賣的商品，并支持快速切換商品。本案例將通過jQuery實現(xiàn)精品展示的功能，要求鼠標指針經(jīng)過左側菜單時，在右側的圖片區(qū)域顯示對應的商品圖。10.1.3【案例】精品展示掌握元素追加操作，能夠靈活應用jQuery中常用的元素追加操作方法

先定一個小目標！10.1.4元素追加操作10.1.4元素追加操作在網(wǎng)頁開發(fā)中，當需要根據(jù)用戶行為動態(tài)地添加頁面內(nèi)容時，可以使用元素追加操作。例如，用戶單擊某個按鈕時，頁面會展示新的圖片或打開新的菜單列表。10.1.4元素追加操作元素追加是指在現(xiàn)有的元素中進行子元素或兄弟元素的添加。jQuery提供了元素追加方法，可以幫助開發(fā)者快速更新頁面內(nèi)容、改善用戶體驗、增強頁面交互性。下面列舉jQuery中常用的元素追加方法，具體如下表所示。分類方法說明追加子元素append(content|fn)將參數(shù)指定的內(nèi)容插入匹配元素集中每個元素內(nèi)部的末尾prepend(content|fn)將參數(shù)指定的內(nèi)容插入匹配元素集中每個元素內(nèi)部的開頭appendTo(target)將匹配元素集中的每個元素插入目標元素內(nèi)部的末尾prependTo(target)將匹配元素集中的每個元素插入目標元素內(nèi)部的開頭10.1.4元素追加操作>>續(xù)上一頁表分類方法說明追加兄弟元素after(content|fn)在匹配元素集中的每個元素之后插入由參數(shù)指定的內(nèi)容before(content|fn)在匹配元素集中的每個元素之前插入由參數(shù)指定的內(nèi)容insertAfter(target)在目標元素之后插入匹配元素集中的每個元素insertBefore(target)在目標元素之前插入匹配元素集中的每個元素10.1.4元素追加操作掌握元素復制操作，能夠使用clone()方法實現(xiàn)元素復制操作

先定一個小目標！10.1.5元素復制操作10.1.5元素復制操作在實際開發(fā)中，當使用元素追加操作將匹配元素插入目標元素的末尾或者開頭時，通常會移動匹配元素的位置。若要實現(xiàn)在不移動元素位置的情況下夠將匹配元素插入目標元素中，可以使用元素復制操作。在jQuery中，使用clone()方法可以實現(xiàn)元素復制操作，該方法的語法格式如下。element.clone([Events][,deepEvents])10.1.5元素復制操作上述語法格式中，參數(shù)Events表示是否復制元素的事件驅動程序和數(shù)據(jù)，默認為false；參數(shù)deepEvents表示是否深層復制，默認為false。掌握元素替換和刪除操作，能夠靈活應用jQuery中常用的元素替換和刪除方法

先定一個小目標！10.1.6元素替換和刪除操作元素替換是指將選中的元素替換為指定的元素，元素刪除是指將選中的元素或某個元素的子元素刪除。在實際開發(fā)中，當需要替換或刪除某個元素時，可以使用jQuery提供的元素替換方法或元素刪除方法。10.1.6元素替換和刪除操作下面列舉jQuery中常用的元素替換和刪除方法，具體如下表所示。分類方法說明元素替換replaceWith(newContent)將所有匹配的元素替換成新內(nèi)容，參數(shù)newContent表示新內(nèi)容，可以是HTML字符串、DOM元素、元素數(shù)組或jQuery對象replaceAll(selector)用匹配的元素替換掉所有selector匹配到的元素元素刪除empty()刪除元素下的子元素，但不刪除元素本身remove([selector])刪除元素下的子元素和元素本身，可選參數(shù)selector用于篩選元素10.1.6元素替換和刪除操作jQuery尺寸和位置操作10.2掌握尺寸操作方法的使用，能夠靈活應用jQuery中常用的尺寸操作方法10.2.1

尺寸操作方法

先定一個小目標！jQuery提供的尺寸操作方法用于獲取或設置元素的高度和寬度，下面列舉jQuery中常用的尺寸操作方法，具體如下表所示。方法說明width()獲取第一個匹配元素的當前寬度，返回數(shù)字型結果width(value)為所有匹配的元素設置寬度，value可以是字符串或數(shù)字height()獲取第一個匹配元素的當前高度，返回數(shù)字型結果height(value)為所有匹配的元素設置高度，value可以是字符串或數(shù)字outerWidth([includeMargin])匹配獲取元素集中第一個元素的當前計算的外部寬度，includeMargin表示是否包括邊距，默認為false，表示不包括outerHeight(value[,includeMargin])為所有匹配的元素設置高度為value10.2.1

尺寸操作方法掌握位置操作方法的使用，能夠靈活應用jQuery中常用的位置操作方法10.2.2位置操作方法

先定一個小目標！jQuery提供的位置操作方法用于獲取或設置元素的位置，下面列舉jQuery中常用的位置操作方法，具體如下表所示。方法說明offset()獲取元素的位置，返回的是一個對象，包含left屬性和top屬性offset(coordinates)使用對象coordinates設置元素的位置，必須包含left屬性和top屬性scrollTop()和scrollLeft()獲取匹配元素相對滾動條頂部和左部的位置scrollTop(value)和scrollLeft(value)設置匹配元素相對滾動條頂部和左部的位置10.2.2位置操作方法jQuery事件操作10.3掌握頁面加載事件，能夠靈活應用頁面加載事件實現(xiàn)將jQuery代碼寫在DOM元素前面

先定一個小目標！10.3.1頁面加載事件10.3.1頁面加載事件頁面加載事件用于實現(xiàn)頁面的初始化。在使用jQuery操作DOM元素時，為了確保jQuery代碼能夠生效，需要將jQuery代碼寫在DOM元素后面，否則代碼不會生效。如果想要將jQuery代碼寫在DOM元素前面，就需要使用頁面加載事件來實現(xiàn)。10.3.1頁面加載事件在jQuery中，頁面加載事件的語法格式有3種，具體如下。$(document).ready(function(){}) //語法格式1$().ready(function(){}) //語法格式2$(function(){}) //語法格式3在上述語法格式中，ready()方法用于監(jiān)聽頁面加載事件。在頁面DOM元素加載完成后，將需要運行的代碼寫到function()函數(shù)中，并傳遞給jQuery，由jQuery在合適的時機運行。掌握事件注冊，能夠靈活應用事件方法或on()方法實現(xiàn)事件注冊

先定一個小目標！10.3.2事件注冊在前面學習DOM的相關知識時，講解了如何通過標簽的屬性進行事件注冊，以及如何在JavaScript代碼中獲取元素后使用“元素對象.事件屬性”完成事件的注冊。在jQuery中，實現(xiàn)事件注冊的方式有兩種，第1種方式是通過事件方法實現(xiàn)事件注冊，第2種方式是通過on()方法實現(xiàn)事件注冊。10.3.2事件注冊10.3.2事件注冊1.通過事件方法實現(xiàn)事件注冊在jQuery中通過調(diào)用某個事件方法，并傳入事件處理函數(shù)就可以實現(xiàn)事件注冊。jQuery的事件處理方法和DOM中的事件屬性相比，省略了開頭的“on”，例如，jQuery中的click()方法對應DOM中的onclick事件屬性。jQuery中的事件方法允許多次調(diào)用，從而可以為一個事件注冊多個事件處理函數(shù)。下面列舉jQuery中常用的事件方法，具體如下表所示。10.3.2事件注冊分類方法說明表單事件blur([eventData][,handler])當元素失去焦點時觸發(fā)focus([eventData][,handler])當元素獲得焦點時觸發(fā)change([eventData][,handler])當元素的值發(fā)生改變時觸發(fā)focusin([eventData][,handler])在父元素上檢測子元素獲取焦點的情況focusout([eventData][,handler])在父元素上檢測子元素失去焦點的情況select([eventData][,handler])當文本框（包括<input>和<textarea>）中的文本被選中時觸發(fā)submit([eventData][,handler])當表單提交時觸發(fā)>>續(xù)上一頁表10.3.2事件注冊分類方法說明鍵盤事件keydown([eventData][,handler])按鍵盤按鍵時觸發(fā)keypress([eventData][,handler])按鍵盤按鍵（“Shift”“Fn”“CapsLock”等非字符鍵除外）時觸發(fā)keyup([eventData][,handler])鍵盤按鍵彈起時觸發(fā)鼠標事件mouseover([eventData][,handler])當鼠標指針移入元素或其子元素時觸發(fā)mouseout([eventData][,handler])當鼠標指針移出元素或其子元素時觸發(fā)mouseenter([eventData][,handler])當鼠標指針移入元素時觸發(fā)mouseleave([eventData][,handler])當鼠標指針移出元素時觸發(fā)10.3.2事件注冊分類方法說明鼠標事件click([eventData][,handler])當單擊元素時觸發(fā)dblclick([eventData][,handler])當雙擊元素時觸發(fā)mousedown([eventData][,handler])當鼠標指針移動到元素上方，并按鼠標按鍵時觸發(fā)mouseup([eventData][,handler])當在元素上放松鼠標按鍵時會被觸發(fā)瀏覽器事件scroll([eventData][,handler])當滾動條發(fā)生變化時觸發(fā)resize([eventData][,handler])當調(diào)整瀏覽器窗口的大小時會被觸發(fā)>>續(xù)上一頁表10.3.2事件注冊2.通過on()方法實現(xiàn)事件注冊jQuery提供的on()方法用于為元素注冊一個或多個事件，也可以為不同事件注冊相同的事件處理函數(shù)，通過on()方法注冊一個事件的語法格式如下。element.on(event,fn)通過on()方法注冊多個事件的語法格式如下。element.on({event:fn},{event:fn},…)通過on()方法為不同的事件注冊相同的事件處理函數(shù)的語法格式如下。element.on(events,fn)使用jQuery的排他操作清除元素樣式多學一招前面的章節(jié)講解了如何使用JavaScript排他操作實現(xiàn)高亮顯示被單擊的按鈕，在實際開發(fā)中，還可以使用jQuery的排他操作清除元素樣式。例如，頁面中有3個按鈕，當單擊任意一個按鈕時，該按鈕的背景顏色將顯示為粉色，其他兩個按鈕的背景顏色不顯示。10.3.2事件注冊多學一招若要實現(xiàn)這樣的效果，則可以使用jQuery的排他操作，示例代碼如下。<body>

<button>按鈕1</button>

<button>按鈕2</button>

<button>按鈕3</button>

<script>

$('button').click(function(){

$(this).css('background','pink');

$(this).siblings('button').css('background','');

});

</script></body>10.3.2事件注冊掌握事件觸發(fā)，能夠靈活應用事件方法、trigger()方法和triggerHandler()方法實現(xiàn)事件觸發(fā)

先定一個小目標！10.3.3事件觸發(fā)通常在為元素注冊事件后，由用戶或瀏覽器觸發(fā)事件，若希望某個事件在程序中被觸發(fā)，就需要手動觸發(fā)這個事件。在jQuery中，實現(xiàn)事件觸發(fā)的方式有3種，第1種方式是通過事件方法實現(xiàn)事件觸發(fā)；第2種方式是通過trigger()方法實現(xiàn)事件觸發(fā)；第3種方式是通過triggerHandler()方法實現(xiàn)事件觸發(fā)。10.3.3事件觸發(fā)1.通過事件方法實現(xiàn)事件觸發(fā)在jQuery中，調(diào)用事件方法還可以實現(xiàn)事件觸發(fā)，兩者的區(qū)別在于是否傳入?yún)?shù)（傳入?yún)?shù)表示事件注冊，不傳入?yún)?shù)則表示事件觸發(fā)），示例代碼如下。<body>

<div>通過事件方法實現(xiàn)事件觸發(fā)</div>

<script>

//事件注冊

$('div').click(function(){

alert('Hello');

});

//事件觸發(fā)

$('div').click();

</script></body>10.3.3事件觸發(fā)2.通過trigger()方法實現(xiàn)事件觸發(fā)使用trigger()方法可以觸發(fā)指定事件，示例代碼如下。<body>

<div>通過trigger()方法實現(xiàn)事件觸發(fā)</div>

<script>

//事件注冊

$('div').click(function(){

alert('Hello');

});

//事件觸發(fā)

$('div').trigger('click');

</script></body>10.3.3事件觸發(fā)3.通過triggerHandler()方法實現(xiàn)事件觸發(fā)通過事件方法和trigger()方法觸發(fā)事件時，都會運行元素的默認行為，而通過triggerHandler()方法觸發(fā)事件時不會運行元素的默認行為。元素的默認行為是指用戶執(zhí)行某個動作后元素自動產(chǎn)生的行為，例如，文本框獲取焦點時有光標閃爍的現(xiàn)象。10.3.3事件觸發(fā)掌握事件委托，能夠使用on()方法實現(xiàn)事件委托

先定一個小目標！10.3.4事件委托事件委托是指把原本要給子元素注冊的事件委托給父元素，也就是將子元素的事件注冊到父元素上。事件委托的優(yōu)勢在于，可以為未來動態(tài)創(chuàng)建的元素注冊事件，其原理是將事件委托給父元素后，在父元素中動態(tài)創(chuàng)建的子元素也會擁有事件。10.3.4事件委托在jQuery中，事件委托通過on()方法實現(xiàn)，on()方法的語法格式如下。element.on(event,selector,fn)10.3.4事件委托上述語法格式中，event表示事件類型，selector表示子元素選擇器，fn表示事件處理函數(shù)。掌握事件解除，能夠使用off()方法實現(xiàn)事件解除

先定一個小目標！10.3.5事件解除事件解除是指移除元素所注冊的事件，在jQuery中，事件解除通過off()方法實現(xiàn)。off()方法的語法格式如下。element.off(event,selector)上述語法格式中，當off()方法中不傳入?yún)?shù)時，表示解除元素上的所有事件；當off()方法中只傳入event參數(shù)時，表示解除元素上注冊的指定事件；當off()方法中傳入event參數(shù)和selector參數(shù)時，表示解除元素上的事件委托。10.3.5事件解除one()方法多學一招one()方法用于注冊一次性事件。在網(wǎng)頁開發(fā)中，若希望元素的某個事件只觸發(fā)一次，可以使用one()方法實現(xiàn)。例如，為div元素注冊一次性單擊事件，示例代碼如下。10.3.5事件解除<body>

<div>div元素</div>

<script>

$('div').one('click',function(){

console.log('為div元素注冊一次性單擊事件');

});

</script></body>掌握事件對象，能夠使用事件對象阻止默認行為和事件冒泡

先定一個小目標！10.3.6事件對象10.3.6事件對象當事件被觸發(fā)時，就會產(chǎn)生事件對象，在事件處理函數(shù)中可以使用參數(shù)接收事件對象。除此之外，還可以使用事件對象阻止默認行為和事件冒泡。下面通過代碼演示如何查看事件對象。<body>

<div>單擊事件對象</div>

<script>

$('div').click(function(event){

console.log(event);

});

</script></body>10.3.6事件對象首先單擊頁面中的“單擊事件對象”，然后查看事件對象的輸出結果，如下圖所示。10.3.6事件對象下面通過代碼演示如何使用事件對象阻止默認行為和事件冒泡。

<body>

<ahref="1.html">請單擊</a>

<script>

$(document).on('click',function(){

console.log('單擊了document');

});

$('a').on('click',function(event){

event.preventDefault();

//阻止事件默認行為

console.log('單擊了a');

});

</script></body>10.3.6事件對象若要阻止事件冒泡，可以添加如下代碼。event.stopPropagation() //阻止事件冒泡掌握Tab欄切換的案例，能夠編寫代碼實現(xiàn)案例

先定一個小目標！10.3.7【案例】Tab欄切換Tab是指頁面中的標簽，Tab欄切換是一種常見的網(wǎng)頁特效，在網(wǎng)頁開發(fā)中，使用Tab欄切換可以提高用戶的體驗，當用戶單擊頁面中的標簽時，會顯示當前標簽下的內(nèi)容。10.3.7【案例】Tab欄切換10.3.7【案例】Tab欄切換下面將通過一個案例演示Tab欄切換的實現(xiàn)，本案例的具體實現(xiàn)思路如下。編寫頁面結構。使用div元素、ul元素和li元素分別定義Tab欄列表結構和展示當前標簽下的頁面結構。編寫頁面樣式。當單擊當前標簽時，當前標簽的背景顏色為綠色。通過jQuery實現(xiàn)業(yè)務邏輯。當單擊頂部標簽欄中的li元素時，當前l(fā)i元素添加current類名，其他兄弟元素移除current類名，并且同時得到當前l(fā)i元素的索引，讓內(nèi)容區(qū)域中相應索引的內(nèi)容顯示，其他內(nèi)容隱藏。在瀏覽器中進行測試，運行結果如下圖所示。10.3.7【案例】Tab欄切換當單擊列表標簽中的“規(guī)格與包裝”時，運行結果如下圖所示。jQuery動畫10.4掌握顯示和隱藏效果，能夠靈活應用控制元素顯示和隱藏的方法

先定一個小目標！10.4.1顯示和隱藏效果10.4.1顯示和隱藏效果在某個電商平臺的頁面開發(fā)中，假設需要給用戶提供商品篩選的功能，由于頁面空間有限，需要當用戶單擊“展開篩選條件”按鈕時，展開篩選條件，用戶完成篩選后將篩選條件收起。若要實現(xiàn)這個開發(fā)需求，則可以使用jQuery中的顯示和隱藏效果。jQuery中控制元素顯示和隱藏效果的方法如下表所示。方法說明show([duration][,easing][,complete])顯示被隱藏的匹配元素hide([duration][,easing][,complete])隱藏已顯示的匹配元素toggle([duration][,easing][,complete])元素顯示和隱藏切換掌握滑動效果，能夠靈活應用控制元素上滑和下滑的方法

先定一個小目標！10.4.2滑動效果在網(wǎng)頁開發(fā)中，使用滑動效果可以提升用戶體驗，例如，在開發(fā)垂直導航菜單時，可以通過滑動效果設置當用戶單擊導航菜單后，子菜單下拉顯示，再次單擊則收起子菜單。jQuery中常用slideDown()方法和slideUp()方法實現(xiàn)滑動效果，其中，slideDown()方法可以讓HTML元素或者文本自上而下逐漸顯示，而slideUp()方法則是將HTML元素或者文本自下而上逐漸隱藏。10.4.2滑動效果jQuery中控制元素上滑和下滑的方法和說明，具體如下表所示。方法說明slideDown([duration][,easing][,complete])垂直滑動顯示匹配元素（自上而下逐漸顯示）slideUp([duration][,easing][,complete])垂直滑動隱藏匹配元素（自下而上逐漸隱藏）slideToggle([duration][,easing][,complete])在slideDown()和slideUp()兩種

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權或不適當內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論