web前端【第十一篇】jQuery屬性相關操作

知識點總結?

1、屬性
屬性(如果你的選擇器選出了多個對象,那么默認只會返回出第一個屬性)、

attr(屬性名|屬性值)
- 一個參數是獲取屬性的值,兩個參數是設置屬性值
- 點擊加載圖片示例
removeAttr(屬性名)
-刪除屬性的值
prop(屬性名|屬性值)
- 屬性的返回值的是布爾類型
- 單選,反選,取消的例子
removeProp(屬性名)
-刪除屬性的值

循環:each(兩種循環示例)
- $.each(數組/對象, function(i, v){})
- $("div").each(function(){})
CSS類
- addClass 添加類屬性
- removeClass 移除類屬性
- toggleClass 開關|切換(有就移除,沒有就添加)
燈泡的例子
HTML代碼/文本/值
沒有參數就是獲取對應的值,
有參數就設置對應的值
- .html() 添加html標簽 .html("<span>啦啦啦。</span>")
- .text() 添加文本 .text("啦啦啦。")
- .val()
input :一個參數,獲取的是input框里面的值
checkbox :一個參數,獲取的是value的值
select :
單選:獲取值
多選:得到的是一個數組,設置的時候也要是數組

一、屬性操作

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>屬性示例</title>
</head>
<body>
<img src="Bootstrap_i1.png" alt="">
<table border="1"><tbody><tr><td>1</td><td>武俠</td><td>銷售部</td></tr><tr><td>2</td><td>哎哎呀</td><td>財經部</td></tr></tbody>
</table>
<form action=""><input type="checkbox"><input type="checkbox"><input type="checkbox"><input type="radio"><select name="" id=""><option value="">甘肅</option><option value="">蘭州</option><option value="">永登</option><option value="">天水</option><option value="">慶陽</option></select>
</form>
<script src="jquery-3.2.1.min.js"></script>
<script>
//    $("img").attr("src","Bootstrap_i3.png");
//    $("table").attr("aaa");
//    $("table").attr("aaa","按時");
</script>
</body>
</html>

二、示例圖片

 1、attr

  (1)得到屬性和設置屬性值

  (2)設置自定義屬性值

  

  2、removeAttr

  

  3、prop

  

?

  

?  4、removeProp

?三、jquery中的循環的兩種方式

//    方式一li = [11,22,33];$.each(li,function (i,v) {console.log(i,v)// 0 11// 1 22// 2 33})
//    方式二$(".c1").each(function (i,v) {console.log(i,v)  //這里的v拿到的是標簽
//         0 <div class="c1">hah</div>
//         1 <div class="c1">年</div>
//         2 <div class="c1">娃的</div>console.log(v.innerText)  //拿到文本})
</script>

退出循環============================

?

?三、注意的一個下問題:

解決方法

?

轉載于:https://www.cnblogs.com/xiaohema/p/8455514.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/390187.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/390187.shtml
英文地址,請注明出處:http://en.pswp.cn/news/390187.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

528. 按權重隨機選擇

528. 按權重隨機選擇 給定一個正整數數組 w &#xff0c;其中 w[i] 代表下標 i 的權重&#xff08;下標從 0 開始&#xff09;&#xff0c;請寫一個函數 pickIndex &#xff0c;它可以隨機地獲取下標 i&#xff0c;選取下標 i 的概率與 w[i] 成正比。 例如&#xff0c;對于 w…

sql語句語法多表關聯_SQL創建表語句-帶有示例語法

sql語句語法多表關聯SQL is one of the most reliable and straightforward querying languages around. It provides clear cut syntax that reads easily without abstracting away too much of the functionalitys meaning.SQL是最可靠&#xff0c;最直接的查詢語言之一。 它…

分布式改造劇集三:Ehcache分布式改造

第三集&#xff1a;分布式Ehcache緩存改造 前言 ? 好久沒有寫博客了&#xff0c;大有半途而廢的趨勢。忙不是借口&#xff0c;這個好習慣還是要繼續堅持。前面我承諾的第一期的DIY分布式&#xff0c;是時候上終篇了---DIY分布式緩存。 探索之路 ? 在前面的文章中&#xff0c;…

85. 最大矩形

85. 最大矩形 給定一個僅包含 0 和 1 、大小為 rows x cols 的二維二進制矩陣&#xff0c;找出只包含 1 的最大矩形&#xff0c;并返回其面積。 示例 1&#xff1a; 輸入&#xff1a;matrix [[“1”,“0”,“1”,“0”,“0”],[“1”,“0”,“1”,“1”,“1”],[“1”,“1”…

TP單字母函數

A方法 A方法用于在內部實例化控制器 調用格式&#xff1a;A(‘[項目://][分組/]模塊’,’控制器層名稱’) 最簡單的用法&#xff1a; $User A(User); 表示實例化當前項目的UserAction控制器&#xff08;這個控制器對應的文件位于Lib/Action/UserAction.class.php&#xff09;…

Angular問題03 @angular/material版本問題

1 問題描述 應用使用 angular4在使用angular/material時&#xff0c;若果在導入模塊時使用mat開頭&#xff0c;就會報錯。 2 問題原因 angular/material版本出現問題&#xff0c;angular/material 從版本5開始就必須要angular5的核心依賴&#xff1b;想要在angular5之前版本中的…

onclick判斷組件調用_從子組件Onclick更新狀態

onclick判斷組件調用How to update the state of a parent component from a child component is one of the most commonly asked React questions.如何從子組件更新父組件的狀態是最常見的React問題之一。 Imagine youre trying to write a simple recipe box application, …

Python 列表List的定義及操作

# 列表概念&#xff1a;有序的可變的元素集合# 定義 # 直接定義 nums [1,2,3,4,5]# 通過range函數構造&#xff0c;python2 和python3 版本之間的差異&#xff1b; # python3 用的時候才會去構造 nums range(1,101)# 列表嵌套 # 注意和C語言中數組的區別,是否可…

遞歸分解因數

題目總時間限制: 1000ms 內存限制: 65536kB描述給出一個正整數a&#xff0c;要求分解成若干個正整數的乘積&#xff0c;即a a1 * a2 * a3 * ... * an&#xff0c;并且1 < a1 < a2 < a3 < ... < an&#xff0c;問這樣的分解的種數有多少。注意到a a也是一種分解…

劍指 Offer 51. 數組中的逆序對

劍指 Offer 51. 數組中的逆序對 在數組中的兩個數字&#xff0c;如果前面一個數字大于后面的數字&#xff0c;則這兩個數字組成一個逆序對。輸入一個數組&#xff0c;求出這個數組中的逆序對的總數。 示例 1: 輸入: [7,5,6,4] 輸出: 5 限制&#xff1a; 0 < 數組長度 &…

react 圖像識別_無法在React中基于URL查找圖像

react 圖像識別If youre new to React and are having trouble accessing images stored locally, youre not alone.如果您不熟悉React&#xff0c;并且無法訪問本地存儲的圖像&#xff0c;那么您并不孤單。 Imagine you have your images stored in a directory next to a co…

html單行元素居中顯示,多行元素居左顯示

有很多的業務需要元素或者文字如果單行&#xff0c;居中顯示&#xff0c;如果數據增多&#xff0c;居中顯示代碼&#xff08;直接復制到編輯器可用&#xff09;&#xff1a;<!DOCTYPE html> <html lang"en"> <head> <meta charset"UTF-8&q…

ML.NET 0.2版增加了集群和新示例

在今年的Build大會上&#xff0c;微軟首次發布了ML.NET。ML.NET是開源的、跨平臺的以及運行在.NET上的機器學習框架。微軟的Ankit Asthana宣布該項目已經完成了第二版的開發。第二版增加了幾個新功能&#xff0c;包括名為集群的新機器學習任務&#xff0c;交叉驗證和訓練-測試&…

如何變得井井有條-來之不易的秘訣來組織您的生活

Because of the changes brought about by COVID-19, many people have had to find healthy and productive ways of working remotely. 由于COVID-19帶來的變化&#xff0c;許多人不得不尋找健康有效的遠程工作方式。 Some have been sent home and can continue doing thei…

被未知進程占用端口的解決辦法

echo off echo 這是用來結束一個未知進程占用端口的批處理可執行文件ipconfig /allnetstat -anoecho 請查看以上信息&#xff0c;輸入被占用的端口號:set /p port請輸入port:tasklist|findstr %port%echo 請結合上述程序進行輸入&#xff0c;請**謹慎輸入**set /p program請輸入…

怎樣在減少數據中心成本的同時不犧牲性能?

2019獨角獸企業重金招聘Python工程師標準>>> 導讀雖然組織對數據中心提出了更高的要求&#xff0c;但IT管理人員確實有辦法在嚴格的預算內展開工作。如今&#xff0c;組織認為即使性能預期不斷提高&#xff0c;其數據中心預算也在縮減。盡管2018年IT支出總體預計增長…

賽普拉斯 12864_如何使用賽普拉斯自動化輔助功能測試

賽普拉斯 12864In my previous post, I covered how to add screenshot testing in Cypress to ensure components dont unintentionally change over time. 在上一篇文章中 &#xff0c;我介紹了如何在賽普拉斯中添加屏幕截圖測試&#xff0c;以確保組件不會隨時間變化。 Now…

anaconda在win下和在mac下的安裝區別

1. 在win下安裝anaconda后會提示你選擇環境變量&#xff0c;但是建議使用默認。 于是CMD進入終端和使用navigator進入終端不一樣&#xff0c;前者會提示無此命令&#xff0c;只能通過navigator進入終端 即使在系統變量變量Path里添加了路徑&#xff0c;使用CMD還是不能使用pyth…

fcn從頭開始_如何使用Go從頭開始構建區塊鏈

fcn從頭開始介紹 (Introduction) With Web 3.0 and blockchain becoming more mainstream every day, do you know what blockchain is? Do you know its technical advantages and use-cases?隨著Web 3.0和區塊鏈每天變得越來越主流&#xff0c;您知道什么是區塊鏈嗎&#x…

java實現無序數組結構

一、數組的2種定義方式 數據類型 [] 數組名稱 new 數據類型[數組長度]; 這里 [] 可以放在數組名稱的前面&#xff0c;也可以放在數組名稱的后面&#xff0c;一般放在名稱的前面 數據類型 [] 數組名稱 {數組元素1&#xff0c;數組元素2&#xff0c;......} 這種方式聲明數組的…