二jquery基本操作(2)

1jquery对样式的操作(类)

1.1增加/删除样式

1.1.1addClass()
1.1.2removeClass()

1.2检查是否有某个指定的样式

hasClass()

1.3.增加删除样式

toggleClass()

2jquery对属性的操作

2.1添加(或者返回)/删除属性(常用)

attr() 没有是添加,有的话是返回,有两个参数,属性名,属性值,如果属性值没有设置,就可以得到这个值
removeAttr()
小知识:
图片的lazingloading:页面打开后图片会默认请求,为了不让未显示到当前屏上的图片去请求,可以用window.scrollY获取滚动条的位置。当没有滚动到图片位置时可以移除图片的src属性,滚动到相关位置时再添加上这个图片,可以减轻服务器的请求压力

2.2获取设置表单对象的值

val()

2.3以json形式返回data-*属性值

data()

3jquery对css的操作

$('p').css("属性名","属性值");如果没传属性值,意思就是获取这个属性的属性值和attr一样
注意:使用css设置font-size时不需要加px,返回的却是带px的字符串
此时需要用parseInt();

4jquery对domTree的操作

在Dom树中找到指定的元素并进行操作

4.1向上遍历

parent() parents()包括爷爷
parentsUtil() closest()

4.2向下遍历

find() children()

4.3同级遍历

siblings() next() nextAll() nextUntil() nextUntil() prev() prevAll() prevUntil()

4.4迭代操作(对数组的遍历操作)

4.4.1filter()

括号里是函数function(index,object){}
如果return true;返回匹配对象

4.4.2each()

返回上不会做一些操作

4.4.3map()

如果return true;返回return的内容,内容匹配,返回内容
以下是这三个方法在console.log()里的执行情况
html代码:

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script type="text/javascript"src="jquery-3.1.0.min.js">
    
  </script>
  <script type="text/javascript">
    
  </script>
 </head>
 <body>
    <div id="" class="nav-list">
        <ul>
            <li class="nav-item">
                <h3><a href="#">研发.编程</a></h3>
                <p><a href="#" id="test">HTML5</a>
                   <a href="#">Java</a>
                </p>
            </li>
            <li class="nav-item">
                <h3><a href="#">研发.编程</a></h3>
                <p><a href="#">HTML5</a>
                   <a href="#">Java</a>
                </p>
            </li>
        </ul>
    </div>
 </body>
</html>

var jqueryList = $('a');
undefined
jqueryList.filter(function(){console.log(arguments)});
[]
jqueryList.filter(function(index,object){return index%2==0;});//返回偶数对象
[a, a, a]0: a1: a2: alength: 3prevObject: r.fn.init[6]__proto__: Object[0]
jqueryList.filter(function(index,object){return $("#test");});
[a, a#test, a, a, a, a]0: a1: a#test2: a3: a4: a5: alength: 6prevObject: r.fn.init[6]__proto__: Object[0]
jqueryList.filter(function(index,object){return index%2==1});//返回奇数对象
[a#test, a, a]0: a#test1: a2: alength: 3prevObject: r.fn.init[6]__proto__: Object[0]
jqueryList.filter(function(index,object){return $(object).attr("id")});//有id属性的对象
[a#test]0: a#testlength: 1prevObject: r.fn.init[6]__proto__: Object[0]
jqueryList.map(function(index,object){return $(object).attr("id")});//有id属性的对象
["test"]
jqueryList.map(function(index,object){return index%2==0});//返回偶数对象
[true, false, true, false, true, false]0: true1: false2: true3: false4: true5: falselength: 6prevObject: r.fn.init[6]__proto__: Object[0]
jqueryList.map(function(index,object){return $(object).attr("id")||object});//有id属性的对象
[a, "test", a, a, a, a]
jqueryList.each(function(index,object){return $(object).attr("id")||object});//有id属性的对象
[a, a#test, a, a, a, a]

本文相关代码链接:https://github.com/wangyiman/jqueryResource

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,214评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,307评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,543评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,221评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,224评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,007评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,313评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,956评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,441评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,925评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,018评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,685评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,234评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,240评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,464评论 1 261
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,467评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,762评论 2 345

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,728评论 1 92
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,504评论 25 707
  • 我该正视自己的问题,不该逃避,也不能忽视,更不能骗自己。 继续这样状态,好像会废的!
    小未之阅读 154评论 0 0
  • 早上听全会报告、主旨报告,下午听专题报告,上、下午各一次茶歇,每天都是这个模式(偷偷告诉你,一般下午茶歇过后我就走...
    杨小赖一点儿也不赖阅读 179评论 0 0
  • 古训:七上八下,逢七可以上,逢八准备下。俗话说:七软八硬,否则就会欺软怕硬。人过三十七,既不要欺负人,更不能被人欺...
    水中船阅读 345评论 0 1