文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

jquery中dom元素的attr和prop方法的理解

一、背景 　　在编写使用高版本[ jQuery 1.6 开始新增了一个方法 prop()]的jquery插件进行编写js代码的时候，经常不知道dom元素的attr和prop方法到底有什么区别？...也是W3C里本身就包含的几个属性，换句话说是IDE中能够自动提示的属性，这些属性就被称为dom元素的固有属性，这种情况下，我建议使用prop方法。 　　...2.我们经常会使用a标签进行触发自定义事件 1 删除文章 这个例子中该DOM元素的属性有：href、id、action....那么很明显前两个是该dom元素的固有属性，最后一个是我们自己定义的属性。...、radio、select等元素的选中属性"checked"和"selected"，这些属性也是dom元素的固有属性，因此使用prop方法才能正确的进行获取和设置。

2K20
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    riot.js教程【三】访问DOM元素、使用jquery、mount输入参数、riotjs标签的生命周期

    前文回顾 riot.js教程【二】组件撰写准则、预处理器、标签样式和装配方法； riot.js教程【一】简介； 访问DOM元素 你可以通过this.refs对象访问dom元素 而且还有大量的属性简写方式可以使用...，（有时候你需要对这些东西做一些特殊的处理才能用） 使用Jquery 如果你想在riot标签内部访问dom元素 你可能需要了解一下riot标签生命周期相关的知识 你会注意到，mount方法还没执行的时候...，dom元素是不会被创建的 这就意味着，mount方法之前访问DOM元素，是不会成功的 请看如下代码： Do I even Exist?...jquery是一点问题都没有的； 再看下面的代码（两种检索方式都是支持的，第一种就是jquery检索DOM） Do I even Exist... this.on('mount', function(){ // Contexted jQuery $('p', this.root) //

    2.1K70

    jQuery对象

    当创建新元素（或选择现有元素）时，jQuery返回集合中的元素。jQuery的许多开发人员都认为这个集合是一个数组。.length毕竟，它有一个零索引序列的DOM元素，一些熟悉的数组函数和一个属性。...实际上，jQuery对象比这更复杂。 链接DOM和DOM元素 文档对象模型（简称DOM）是HTML文档的表示形式。它可能包含任意数量的DOM元素。在高层次上，DOM元素可以被认为是网页的“一块”。...通过将target元素包装在一个jQuery对象中，这些边缘情况得到了照顾，预期的结果是在所有支持的浏览器中实现的： // Setting the inner HTML with jQuery....var allParagraphs = $( "p" ); ...可能会期望随着元素被添加和从文档中删除，内容将随着时间的推移而增长和缩小。jQuery对象不以这种方式表现。...allParagraphs = $( "p" ); 链接 linkWrapping Up 虽然DOM元素提供了创建交互式网页所需的所有功能，但它们可能是一个麻烦的工作。

    1.7K10

    angularJS之站在jQuery的肩膀上

    标准的HTML页面是静态的，被浏览器渲染后就产生了一个DOM树： ? jQuery让静态的文档动起来，通过提供一系列的选择符，jQuery使开发者能够 极其方便地选中一组DOM节点，对其进行操作。...基本不用考虑跨浏览器的兼容性 jQuery的API符合大多数开发者的预期，因此，很容易上手。...扩展的方法 jqLite包括一些额外的方法以适应AngularJS框架： controller(name) - 获得元素对应的控制器对象 injector() - 获得元素对应的注入器对象 scope(...) - 获得元素对应的作用域对象 isolateScope() - 获得元素对应的隔离作用域对象，如果有的话。...扩展的事件 jqLite还提供一个$destroy事件，当DOM对象被从DOM树删除时，AngularJS将触发 这个事件，以便指令进行一些善后清理工作。

    1.2K10

    拉手网面试题，不一样的难度

    和你预期的一样吗？如果不一样该如何处理？...想直接获取这个div的dom对象，如何获取？dom对象如何转化为jQuery对象？ 4、如何显示/隐藏一个dom元素？...请用原生的JavaScript方法实现 5、JavaScript有哪几种数据类型 6、jQuery框架中$.ajax()的常用参数有哪些？...写一个post请求并带有发送数据和返回数据的样例 7、JavaScript数据元素添加、删除、排序等方法有哪些？ 欢迎沟通交流~HTML5学堂 8、如何添加html元素的事件，有几种方法？...A.任何文件夹都可以删除 B.空文件夹可以删除 C.有权限的任何文件夹都可以删除 D.有权限的空文件夹可以删除 20、写一个php函数，要求两个日期字符串的天数差，如2012-02-05~2012-03

    1K80

    为什么越来越少的人用 jQuery？

    最早期的开发，大多都使用jQuery，它给我们带来了很多的便利：快速选取元素，方便操作DOM元素的API，各个浏览器之间完美的兼容性，链式操作，动画、ajax等等都是jQuery为前端开发人员来带的好处...这两个方法可以通过传入css选择器形式的字符串，就可以匹配到预期的DOM节点。以下是目前两个API的兼容情况： ? ? 从图中可以看到，这两个API已经很好的兼容各个浏览器。...Vue中也是使用此API进行元素获取的： ? 所以说jQuery快速选择DOM节点的优势已经不存在了。...2.方便操作DOM元素的API 可以方便操作DOM元素的API，比如addClass 、removeClass 、toggleClass。现在原生JS也得到了支持，这个API叫做classList。...在传统开发模式中，这时的换一换按钮肯定执行的还是上面的代码，获取元素，修改元素的innerHTML，但是现在问题出现了，就是我们有必要将所有元素重新删除，再重新添加一遍吗？

    1.1K30

    为什么越来越少的人用 jQuery？

    最早期的开发，大多都使用jQuery，它给我们带来了很多的便利：快速选取元素，方便操作DOM元素的API，各个浏览器之间完美的兼容性，链式操作，动画、ajax等等都是jQuery为前端开发人员来带的好处...这两个方法可以通过传入CSS选择器形式的字符串，就可以匹配到预期的DOM节点。以下是目前两个API的兼容情况： ? querySelector兼容情况 ?...querySelectorAll兼容图 从图中可以看到，这两个API已经很好的兼容各个浏览器。 Vue中也是使用此API进行元素获取的： ? 所以说jQuery快速选择DOM节点的优势已经不存在了。...2.方便操作DOM元素的API 可以方便操作DOM元素的API，比如addClass 、removeClass 、toggleClass。现在原生JS也得到了支持，这个API叫做classList。...在传统开发模式中，这时的换一换按钮肯定执行的还是上面的代码，获取元素，修改元素的innerHTML，但是现在问题出现了，就是我们有必要将所有元素重新删除，再重新添加一遍吗？

    1.5K21

    一个小时学会jQuery

    二、jQuery对象和DOM对象 2.1、DOM对象 使用JavaScript中的DOM API操作获得的元素对象叫DOM对象。...2.2、jQuery对象 jQuery对象就是通过jQuery包装DOM对象后产生的对象叫jQuery对象。 jQuery对象是对DOM元素封装过后的数组，也称为包装集。...DOM对象； $只是jQuery的别名形式； 每一个jQuery对象都是一个DOM对象的集合 三、常用选择器 通过jQuery中的选择器实际上取得的是HTML中的DOM元素。..."*")选取所有的元素 可以使用这些基本选择器来完成绝大多数的工作，下面我们对这些选择器一一进行讲解。...").replaceAll("p"); //用匹配的节点替换掉所有 selector匹配到的节点 4.15、DOM删除 $("p").empty(); //删除匹配的节点集合中所有的子节点，不包括本身

    22.4K71

    jQuery已“死”？为清除技术债，我们删掉了前端所有jQuery依赖

    而 JQuery 开发者可以使用 CSS 选择器和函数可以轻松地遍历和操作 DOM， 此外，JQuery 还提供了一些开箱即用的函数来做动画 DOM 元素，而无需弄乱 CSS。...JQuery 提供了一个可以在大多数浏览器上工作的 API，这在当时使用 JavaScript 是很难实现的。...例如，可以使用带有 querySelector 和 querySelectorAll 的 CSS 选择器语法来选择元素，使用 classList API 在元素上添加、删除和切换类，使用 addEventListener...将事件处理程序附加到 DOM 元素和窗口等等。...有网友评论道，“我个人发现普通的 JS API 和 fetch 甚至比 jQuery 的东西更干净。人们仍然出于习惯使用 jQuery，是因为摆脱它需要做很多工作。” jQuery 已“死”？

    1.2K30

    【Java 进阶篇】JQuery DOM操作：轻松驾驭网页内容的魔法

    在本篇博客中，我们将深入探讨JQuery的DOM内容操作，揭开这段神奇的前端魔法。 JQuery的魅力 首先，让我们回顾一下JQuery的魅力。...DOM操作基础 在开始DOM内容操作之前，让我们先了解一下DOM的基础知识。DOM是一种将HTML文档以树形结构呈现的模型，每个HTML元素都是树中的一个节点。...这种结构使得我们能够通过JavaScript（或JQuery）轻松地操作、创建、删除和替换HTML元素。 选取元素 在JQuery中，选择器是我们选取DOM元素的利器。.../p>"); 删除元素内容 通过empty()方法，我们可以清空元素的内容。...// 清空元素内容 $("#myElement").empty(); 示例：创建一个待办事项列表 让我们通过一个实际的示例来演示JQuery DOM内容操作的强大之处。

    62050

    virtual DOM 与 diff 算法入门介绍

    ，标签、属性、子节点等等，这样我们就完成了 virtual DOM 的初始工作，那么 virtual DOM 到底是怎么实现的呢，不急，我们先去看看在没有它出现之前，用 jQuery 是怎样实现的~ DEMO...我们仿照官方示例，试图改写刚才的 DEMO，随后去浏览器中查看 DOM 元素的变化，看看是否与我们预期的相一致。 <!...tag) { return null } // 创建真实的 DOM 元素 var elem = document.createElement(tag)...元素做了最简单的对比，就像本节开始提醒到的，我们现在在了解的阶段，无需去关注细节，把握大体实现流程即可。...本文没有涉及到的内容，比如节点的新增和删除、节点的重新排序、节点的样式、属性、事件绑定等内容，如果有兴趣的同学可以自己下来慢慢研究。

    49120

    Jquery基础之DOM操作

    下面的html页面结构可以构建出一棵DOM树，代码： View Code 　构建出的DOM树如下： 　　JQuery中的DOM操作主要对包括：建【新建】、增【添加】、删【删除】、改【修改】、查【查找...下面的DOM操作将围绕上面的DOM树进行学习JQueryDOM操作。 　　一、查--查找DOM节点 　　　　查找节点非常容易，使用选择器就能轻松完成各种查找工作。...先创建元素点，创建元素节点使用Jquery的工厂函数 li1=("") 　　　　　　代码返回$li1就是一个由DOM对象包装成的JQuery对象。...DOM对象包装成JQuery对象，把新建的文本节点添加到DOM树中JQuery代码如下： ("ul").append( 　　　　　　添加后页面中能看到"·苹果"，右键查看页面源码发现新加的文本节点没有...四、删--删除DOM节点操作 　　　　　　如果想要删除文档中的某个元素JQuery提供了两种删除节点的方法：remove()和empty(); 　　　　1、remove()方法 　　　　　　remove

    66010

    jQuery操作DOM元素

    实现上述两个功能当然可以使用原生js来完成，但在实际开发过程中很少这样做，通常会使用一些别人封装好的js库来辅助我们的工作，jQuery就是这些辅助库中的一员。...tr元素，返回类型是DOM元素数组 :odd $("tr:odd")，选取页面上索引为奇数的tr元素，返回类型是DOM元素数组 :not() $("input:not(:empty)")，所有不为空的...，注意这里#form1和:enabled之间没有空格，有空格表示选取子元素 $("#form1 :disabled");//选取id为form1的表单内所有禁用的元素 常用方法 jQuery的方法只有jQuery...DOM对象和jQuery对象的相互转换 //DOM转jQuery var win=$(window);//将window转换为jQuery对象 //jQuery对象win转DOM对象 win.get[0...，删除的属性不再占用内存资源，在源代码中看不到 css() $('#key').css('color','red')，设置id=key的标签文本颜色为红色 addClass('className') 给元素添加样式

    3.6K40

    DOM 高级工程师不完全指南

    三年前我初入前端坑的时候，发现了一个叫做 jQuery 的宝贝，她有一个神奇的 $ 函数，可以让我快速选中某一个或一组 DOM 元素，并提供链式调用以减少代码的冗余。...而讽刺的是，也正是这两个原生方法的出现，大大加快了 jQuery 的没落，因为它们取代了前者最常用的功能 —— 快捷的选择 DOM 元素。...该方法可以实现将一串 HTML 或 XML 字符串转化为一个完整的 DOM 文档，也就是说，当我们需要获得预期的 DOM 元素时，需要从方法返回的 DOM 文档中获取这个元素： ?...: Boolean，字符数据发生变化时，是否记录并传递其上一个值 childList: Boolean，是否监听目标元素添加或删除子元素 subtree: Boolean，是否扩展监视范围到目标元素下的整个子树的所有元素...当不再监听目标元素的变化时，调用 observer 的 disconnect 方法即可，如果需要的话，可以先调用 observer 的 takeRecords 方法从 observer 的通知队列中删除所有待处理的通知

    92510

    DOM 高级工程师不完全指南

    三年前我初入前端坑的时候，发现了一个叫做 jQuery 的宝贝，她有一个神奇的 $ 函数，可以让我快速选中某一个或一组 DOM 元素，并提供链式调用以减少代码的冗余。...而讽刺的是，也正是这两个原生方法的出现，大大加快了 jQuery 的没落，因为它们取代了前者最常用的功能 —— 快捷的选择 DOM 元素。...该方法可以实现将一串 HTML 或 XML 字符串转化为一个完整的 DOM 文档，也就是说，当我们需要获得预期的 DOM 元素时，需要从方法返回的 DOM 文档中获取这个元素： ?...: Boolean，字符数据发生变化时，是否记录并传递其上一个值 childList: Boolean，是否监听目标元素添加或删除子元素 subtree: Boolean，是否扩展监视范围到目标元素下的整个子树的所有元素...当不再监听目标元素的变化时，调用 observer 的 disconnect 方法即可，如果需要的话，可以先调用 observer 的 takeRecords 方法从 observer 的通知队列中删除所有待处理的通知

    97610
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券