html、text、val、attr、prop区别。this.value和$(this).val()区别以及return用法
html():
html() 方法返回或设置被选元素的内容 (inner HTML)。
当使用该方法读取多个值时,它会返回第一个匹配元素的内容。
当使用该方法设置一个值时,它会覆盖所有匹配元素的内容。
取元素内容的时候会把指定元素下面的代码标签也能获取到
text()
读取多个返回多个
和html()类似,但是只获取指定元素纯文本内容
val():
返回或设置被选元素的值(读取多个只返回第一个),这点和html()类似
通过value属性设置和获取,常用于input元素,只能用在表单元素上
attr():
$().attr(属性名,属性值)→$(selector).attr(attribute,value)
也可设置多个$(selector).attr({attribute:value, attribute:value ...})
返回或设置被选元素属性值,value的属性值
一共有四种写法:
attr(属性名),获取第一个属性值,如果没有返回undefined
attr(属性名,属性值),设置所以匹配元素的属性值
attr(属性名,函数值),设置属性的函数值
attr({属性名一: “属性值一” , 属性名二: “属性值二” , … … }),批量设置属性值
prop()
当该方法用于返回属性值时,则返回第一个匹配元素的值。
当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。
四种用法和attr一样。
attr(),prop()的使用和区别:
| Attribute/Property | .attr() |
.prop() |
|---|---|---|
| accesskey | √ | |
| align | √ | |
| async | √ | √ |
| autofocus | √ | √ |
| checked | √ | √ |
| class | √ | |
| contenteditable | √ | |
| draggable | √ | |
| href | √ | |
| id | √ | |
| label | √ | |
| location ( i.e. window.location ) | √ | √ |
| multiple | √ | √ |
| readOnly | √ | √ |
| rel | √ | |
| selected | √ | √ |
| src | √ | |
| tabindex | √ | |
| title | √ | |
| type | √ | |
width ( if needed over .width() ) |
√ |
获取状态表达不同:
attr('checked'): checked(没选中时,attr获取的是undefined)
prop('checked'): true(统一返回true和false)
添加属性名称立即生效的用prop;
有true和false两个属性的可以用prop;
固有属性的可以考虑使用prop;
其他情况可考虑用attr,比如自定义的dom属性action处理时使用attr
this.value是JS原生态写法,$(this).val()是JQ的写法
html、text、val、attr、prop区别。this.value和$(this).val()区别以及return用法的更多相关文章
- jQuery笔记三——text/html/val/attr/prop
1.获得内容 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容(包括 HTML 标记) val() ...
- jQuery 属性操作attr().prop().text().html().val()
这些方法用于获取和设置 DOM 元素的属性. 一.attr(): <!--样式:在style里面写的,用css来操作.--> <!--属性:在元素里面写的,用attr方法操作.--& ...
- jquery中选择器的 html() text() val() attr() 方法的区别与使用方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQuery.attributes源码分析(attr/prop/val/class)
回顾 有了之前的几篇对于jQuery.attributes相关的研究,是时候分析jQuery.attr的源码了 Javascript中的attribute和property分析 attribute和p ...
- jQuery07源码 (3803 , 4299) attr() prop() val() addClass()等 : 对元素属性的操作
var nodeHook, boolHook, rclass = /[\t\r\n\f]/g, rreturn = /\r/g, rfocusable = /^(?:input|select|text ...
- jquery13 attr() prop() val() addClass()等 : 对元素属性的操作
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- jquery之 css()方法。用法类似的有attr(),prop(),val()
[注]attr(),prop(),val()的用法结构和css()一致,可参考 css()函数用于设置或返回当前jQuery对象所匹配的元素的css样式属性值. 该函数属于jQuery对象(实例).如 ...
- jquery中attr() & prop() 的区别与其实现方法
$(function(){ $('#check').attr('checked'); // undefind ???一头雾水 }) 在jquery中 attr 本来就是用来设置或者获取属性的,可是上面 ...
- attr(),prop()二者区别和最佳实践
attr(),prop()二者区别和最佳实践 最近使用到attr()来获取自定义属性值,我印象中是有一个方法可以获取到自定义属性值,进而我又想到了另一个方法prop(). 查看了手册发现并没有对二者 ...
随机推荐
- 最全 Linux 磁盘管理基础知识全汇总
一.存储设备的挂载和卸载 存储设备的挂载和卸载常用操作命令:fdisk -l.df.du.mount.umount. fdisk -l 命令 1.作用 查看所有硬盘的分区信息,包括没有挂上的分区和 ...
- oracle如何操作约束
自我总结,欢迎怕转! 约束的作用不多说了,直接看怎么用吧. 非空约束: 在创建表时设置非空约束: CREATE TABLE table_name( column_name datatype NOT N ...
- json模块和pickle模块的用法
在python中,可以使用pickle和json两个模块对数据进行序列化操作 其中: json可以用于字符串或者字典等与python数据类型之间的序列化与反序列化操作 pickle可以用于python ...
- spring boot + vue + element-ui全栈开发入门——开篇
最近经常看到很多java程序员朋友还在使用Spring 3.x,Spring MVC(struts),JSP.jQuery等这样传统技术.其实,我并不认为这些传统技术不好,而我想表达的是,技术的新旧程 ...
- MySQL笔记-turncat、drop、delete的区别
TRUNCATE 语法: TRUNCATE TABLE [schema.] table [{DROP | REUSE} STORAGE]功能: 删除整个表的数据并释放空间 描述: 由于Trunca ...
- 12、SEO工程师指南 - 软件项目角色指南系列文章
第11章 SEO工程师 SEO工程师是一个比较新兴的职位,在实际的项目管理过程中,SEO工程师的地位相对靠后,只有在项目试运行以及运营期间才能体现出SEO工程师的作用.在项目完成之后, ...
- C# ListBox 每行显示颜色设置
使用ListBox时,每行显示不同的颜色 1.把AllowHtmlDraw属性设置为True 2.直接在Add或者AddRange里写标签 代码里用的是DEV插件里的ListBox,使用原生的也是一样 ...
- webrtc底层一对一连接过程探索(三)
一.连接过程继续解读-----fun33-fun35解读 完整代码如下: //fun33-37 console.error('fun35-37==>2332==>2332'); var q ...
- JDBC常见面试题
以下我是归纳的JDBC知识点图: 图上的知识点都可以在我其他的文章内找到相应内容. JDBC常见面试题 JDBC操作数据库的步骤 ? JDBC操作数据库的步骤 ? 注册数据库驱动. 建立数据库连接. ...
- 制作U盘Win10 PE
1.安装Windows ADK 下载地址 http://go.microsoft.com/fwlink/p/?LinkID=232339 2. 已管理员身份启动“部署和映像工具环境” 3.创建WinP ...