jQuery 中attr prop和data之间的区别

最新推荐文章于 2024-11-18 20:28:05 发布

qq_42653574

最新推荐文章于 2024-11-18 20:28:05 发布

阅读量170

点赞数

CC 4.0 BY-SA版权

文章标签： jQuery

本文链接：https://blog.youkuaiyun.com/qq_42653574/article/details/83063554

本文探讨了data、prop和attr在前端开发中的不同作用。通过实例说明，data属性修改的是缓存数据而非直接更改DOM属性，展示了data在jQuery中的使用方式。深入理解这三者的差异有助于更高效地进行前端开发。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先聊一聊data和prop、attr的本质区别吧

dataduix对属性的值不是直接修改而是知识修改了缓存的数据

例如：

$("#txt1").data({ "placeholder": "新的请输入内容", "id": "newPlaceholder" });
console.log($("#txt1").data("placeholder"));

console.log输出的内容是"新的请输入内容",但是在标签里属性placeholder的

值并且没有发生任何改变

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

qq_42653574

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

jQuery第二天学习总结—— jQuery 属性操作(prop、attr、data)

weixin_52819925的博客

08-20

533

jQuery 属性操作 jQuery 常用属性操作有三种：prop() /attr()/ data() ; 设置或获取元素固有属性值 prop() 所谓元素固有属性就是元素本身自带的属性，比如<a>元素里面的href ，比如 <input>元素里面的type。 1.获取属性语法 prop("属性"); 2.设置属性语法 prop("属性", "属性值"); 注意：prop() 除了普通属性操作，更适合操作表单属性：disabled / checked / selected 等。

组件的prop、data和v-bind使用

qq_36981190的博客

09-20

1419

prop赋值：静态赋值和动态绑定 prop和data数据的区别：相同点：prop和data数据使用上没有区别，都可以在模板上用{{}}显示、都可以在组件内部用v-bind绑定基础组件/标签的属性不同点：prop可以用来父传子 https://www.cnblogs.com/ibcdwx/p/14610791.html v-bind的使用： 1、组件内部：将模板里基础组件/标签属性与data/prop绑定 2、组件外部：将组件的prop属性与父组件的data/prop绑定使用场景： 1、父组件实时改变子

参与评论您还未登录，请先登录后发表或查看评论

jQuery的data(),prop(),attr()获取属性

qq_43574741的博客

08-04

199

定义参考 <a href="https://www.baidu.com" class="aaa" id="content" data-Age="18" myAge='99'>手握日月摘星辰</div> console.log("attr:"); console.log($('a').attr("href")); console.log($('a').attr("id")); console.log($('a').attr("myAge")); console.log($

jQuery attr() prop() data()用法及区别

didi8969的博客

06-23

174

jQuery attr() prop() data()用法及区别 .attr()，此方法从jq1.0开始一直存在，官方文档写的作用是读/写DOM的attribute值，其实1.6之前有时候是attribute，有时候又是property。.prop()，此方法jq1...

jQuery中，data()、prop()、attr() 三者区别

一寸灰_du的博客

05-05

388

先来介绍下三个属性 .attr();基于setAttbute和getAttbute，读写元素自定义属性。（注：像class、chacked、selected、disablad这种属性推荐用prop）可以操作任何属性，设置属性值会映射到dom行间样式 .prop();用于读写元素的特性属性。(注：()里面填属性值，第二个参数可修改属性，如.prop(‘checked’,true);）只...

【学习笔记】jQuery中的prop()、attr()、data()方法的对比

heshan1992的博客

09-04

725

一、prop和attr对比（1）prop：property指的是元素对象的属性如：className、nodeType、nodeName等 attr:attribute指的是元素标签的属性如：type、name、class等 $("input").attr("type") = "text"; $(input).prop("nodeName") = "input"; （2）在利用attr和pr

jquery中attr、prop、data区别与用法分析

10-16

jQuery作为前端开发中非常重要的JavaScript库，其提供的attr、prop和data方法分别用于操作HTML元素的属性，理解它们的区别与用法对于前端开发人员来说非常重要。本文将结合实例详细分析这三个方法的差异、功能、使用...

jquery中attr和prop的区别分析

10-24

在jQuery中，`attr` 和 `prop` 是两个用于获取和设置HTML元素属性的方法，但它们之间存在着重要的差异。理解这两个方法的区别对于高效且准确地操作DOM至关重要。首先，`attr` 方法主要用于处理HTML元素的自定义...

Jquery中attr与prop的区别详解

10-19

在jQuery中，`attr`和`prop`是两个用于获取和设置HTML元素属性的方法，但它们之间存在着重要的区别。在高版本的jQuery中，引入`prop`方法是为了更精确地处理元素的特性，特别是那些与JavaScript行为密切相关的属性。...

jQuery中attr()和prop()在修改checked属性时的区别

10-25

在jQuery中，`attr()`和`prop()`方法都是用来处理元素属性的，但它们之间存在重要的区别，尤其是在处理特定属性如`checked`时。`attr()`主要用于获取或设置HTML元素的attribute，而`prop()`则是用于操作元素的特性...

.attr(),.prop()和.data()的区别

simon_wong

12-14

1163

Jquery 中 .attr() .prop() .data()的区别 .attr()和.prop()的区别 .attr()和.prop()都是用来设置或者获取指定函数的，参数和用法已几乎相同，用处却又很大的不同 1. 操作对象不同 a) 在原生JS中attrbute表示HTML文档节点属性，property表示JS对象的属性 b) 在j

data和props的区别

weixin_47027269的博客

03-16

782

data和props的区别

attr()，prop()，和data()的区别

爱学习的fatpig的博客

03-08

376

在面试时遇到了attr()，prop()，和data()的区别这个问题，给胡说八道了一通，感觉很惭愧，特查找了相关资料，做了一些总结。1、使用方式不同对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。<a href="http://www.baidu.com" target="_self" cla...

attr(),prop(),data()三者之间的差别

glsanguo的博客

07-06

331

1.attr()，prop()会直接操作dom节点的属性，通过审查元素可以直观的看到，data()则将属性保存在内存中，审查元素不能看到。 2.参数的书写格式。attr(),prop()需要写完整的属性名，不能修改；data()必须是属性名去掉data再以驼峰方式命名。 3.返回值。 attr(),返回String，prop()返回jQuery； data(),不传参数...

prop校验，prop和data区别

m0_63178019的博客

11-18

638

prop:组件上注册的一些自定义属性prop作用：向子组件传递数据。

组件通信Vue.js

m0_51281306的博客

04-22

1981

子组件如何获取父组件中的数据？父组件如何得知子组件的数据变更？如果是更加复杂的组件关系呢？在组件间传递数据的操作，称为组件通信。组件通信 • 父组件向子组件传值 • 子组件向父组件传值 • 非父子组件传值 • 其他通信方式父组件向子组件传值组件通信父组件向子组件传值 • 通过子组件的 props 选项接收父组件的传值。注意：props 不要与 data 存在同名属性。父组件向子组件传值 • 父组件设置方式如下： Props 命名规则 • 建议 prop..

vuejs中data与props的区别

顺其自然~专栏

04-25

3967

vuejs中data与props的区别： 1、data不需要用户（开发者）传值，自身维护；而props需要用户（开发者）传值。 2、data上的数据都是可读可写的；而props上的数据只可以读的，无法重新赋值。本教程操作环境：windows7系统、vue2.9.6版，DELL G3电脑。在使用Vue.js的过程中，经常会遇到data和props。今天就来探索一下二者的区别。 data（当前组件对象操作的数据）类型：Object|Function 限制：组件的定义只接受F...

vue——Props属性和Data属性概述

qq_42544728的博客

10-04

4750

利用Props可以进行组件之间数据传递（类似于React的Props）。

data和props

qq_43183527的博客

07-17

917

事件驱动在前端来说数据驱动式框架，必然离不开事件驱动，事件驱动一定程度弥补了数据驱动的补足，在dom操作的时代同上都是这样操作：通过特定的选择器查找到需要操作的结点 -> 给结点天界相应的事件监听响应用户操作，效果是这样：用户执行某事件（点击，输入，后退等等） -> 调用JavaScript来修改节点这种模式对业务来说是没有什么问题，但是从开发承办和效率来说会比较力不从心，在...

jquery attr 和 prop方法的区别