分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

jQuery之dom操作(取赋值方法)

发布时间:2023-09-06 02:27责任编辑:彭小芳关键词:jQuery

取赋值相关方法:

                  .html() .text() .size()
                  .addClass() .removeClass() .hasClass()
                  .css()
                  .attr() .prop()
注意:
     1、尽量避免直接添加行间样式,因为其权重过高,这样不利于响应式设计,破坏了c3 + h5 优雅的解决方案
     2、attr和prop的区别:jQuery认为attribute的checked selecked disabled 就是表示该属性初始状态的值,property的checked、selecked、disabled表示该属性实时状态的值
    (true或false)
 
1、.html( )  (即可取值又可赋值)
 ???<ul> ???????<li>1</li> ???????<li>2</li> ???????<li>3</li> ???????<li>4</li> ???????<li>5</li> ???</ul> ???<script src = "./jquery.js"></script> ???<script> ????????$(‘ul‘).html(); ?//取值 (ul里的li全部取) ???????$(‘ul li‘).html(); //只取第一个li ???????//innerHTML ???????$(‘ul‘).html(‘‘); //赋值(可传普通字母,也可带标签) ???????//还可传函数 ???????var arrName = [‘周‘,‘王‘,‘张‘,‘白‘,‘刘‘] ???????$(‘ul li‘).html(function(index,ele){ ??????????return ‘<p style="color:orange">‘+ arrName[index] + ‘</p>‘ ???????}) ????????//赋值时附一个值会把所有的li都赋成9 (取值时取一个,赋值时赋所有) ????????$(‘ul li‘).html(‘9‘); ???</script>

2、text( )

 ???<ul> ???????<li>1</li> ???????<li>2</li> ???????<li>3</li> ???????<li>4</li> ???????<li>5</li> ???</ul> ???<script src = "./jquery.js"></script> ???<script> ????????// text innerText ???????$(‘ul‘).text(); //取值 ???????$(‘ul li‘).text(); //取值(都取,与html不同) ???????//赋值 ???????$(‘ul li‘).text(‘9‘) //都变9 ???????$(‘ul‘).text(‘9‘) //覆盖掉 变成一个9 ???????$(‘ul‘).text(‘<p>3</P>‘) //文本形式的标签 ???????//也可传函数 ???????$(‘ul li‘).text(function(index,ele){ ???????????return arrName[index]; ???????}) ???</script>

3、size( )

$(‘ul li‘).size(); //相当于$(‘ul li‘).length
 
 

jQuery之dom操作(取赋值方法)

原文地址:https://www.cnblogs.com/tianya-guoke/p/10166279.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved