jQuery實現html元素顯示與隱藏的判斷

html+jquery
代碼編纂器:Dreamweaver CS5方式/
1新建一個html文件 , 定名為test.html , 用于講解jQuery實現html元素顯示與埋沒的判定 。

jQuery實現html元素顯示與隱藏的判斷



2在test.html文件內 , 利用p標簽建立三行文字 , 并別離給它們設置id屬性 , 本家兒要用于下面經由過程該id獲得p元素對象 。

jQuery實現html元素顯示與隱藏的判斷



3在test.html文件內 , 設置id屬性為two的p元素的css樣式 , 將display屬性設置為none , 實現該p元素埋沒不顯示 。

jQuery實現html元素顯示與隱藏的判斷



4在test.html文件內 , 利用button標簽建立一個“判定是否埋沒”按鈕 , 給button按鈕綁定onclick點擊事務 , 當按鈕被點擊時 , 執行ispan()函數 。

jQuery實現html元素顯示與隱藏的判斷



5在js標簽中 , 建立ispan()函數 , 在函數內 , 利用$符獲得id為two的元素對象 , 再利用jquery中的css()方式 , 獲得display屬性值 。

jQuery實現html元素顯示與隱藏的判斷



6在ispan()函數內 , 利用if語句判定上一步獲得的display屬性值 , 若是屬性值為none , 則暗示p元素埋沒了 , 不然 , 則暗示p元素沒有埋沒 。

jQuery實現html元素顯示與隱藏的判斷



7【jQuery實現html元素顯示與隱藏的判斷】在瀏覽器打開test.html文件 , 點擊按鈕 , 查看實現的結果 。

jQuery實現html元素顯示與隱藏的判斷



jQuery實現html元素顯示與隱藏的判斷




以上內容就是jQuery實現html元素顯示與隱藏的判斷的內容啦 , 希望對你有所幫助哦!

    猜你喜歡