Questions

本篇文章主要讲解Jquery中对DOM的操作，主要内容如下：

1    内容区

1.1  .addClass()

(1).addClass(className)

 <!DOCTYPE html>

 <html>

 <head>

     <meta name="viewport" content="width=device-width" />

     <script src="~/Scripts/jquery-1.10.2.js"></script>

     <title>Index</title>

     <script>

         $(document).ready(function () {

             $("#BtnJq").click(function(){

                 $("#DivTest").addClass("DivClass");

             })

         })

     </script>

 </head>

 <body>

     <div id="DivTest"></div>

     <input type="button" id="BtnJq" value="JqDomOperate"/>

 </body>

 </html>

(2).addClass(function(index))

 <!DOCTYPE html>

 <html>

 <head>

     <meta name="viewport" content="width=device-width" />

     <script src="~/Scripts/jquery-1.10.2.js"></script>

     <title>Index</title>

     <script>

         $(document).ready(function () {

             $("#BtnJq").click(function(){

                 $("#DivTest").addClass("DivClass");

                 $("#DivTest").addClass(function (index) {

                     return "DivClass" + index;

                 })

             })

         })

     </script>

 </head>

 <body>

     <div id="DivTest"></div>

     <input type="button" id="BtnJq" value="JqDomOperate"/>

 </body>

 </html>

(3).addClass(function(index,currentClass))

 <!DOCTYPE html>

 <html>

 <head>

     <meta name="viewport" content="width=device-width" />

     <script src="~/Scripts/jquery-1.10.2.js"></script>

     <title>Index</title>

     <script>

         $(document).ready(function () {

             $("#BtnJq").click(function(){

                 $("#DivTest").addClass(function (index,currentClass) {

                     return currentClass + index;

                 })

             })

         })

     </script>

 </head>

 <body>

     <div id="DivTest"></div>

     <input type="button" id="BtnJq" value="JqDomOperate"/>

 </body>

 </html>

未完，待续。。。。。。。。。

2    文献区

【01】http://www.jquery123.com/category/attributes/

【02】http://api.jqueryui.com

3     版权区

  • 感谢您的阅读，若有不足之处，欢迎指教，共同学习、共同进步。
  • 博主网址：http://www.cnblogs.com/wangjiming/。
  • 极少部分文章利用读书、参考、引用、抄袭、复制和粘贴等多种方式整合而成的，大部分为原创。
  • 如您喜欢，麻烦推荐一下；如您有新想法，欢迎提出，邮箱：2016177728@qq.com。
  • 可以转载该博客，但必须著名博客来源。

【Jquery】之DOM操作的更多相关文章

  1. jQuery的DOM操作详解

    DOM(Document Object Model-文档对象模型):一种与浏览器, 平台, 语言无关的规则, 使用该接口可以轻松地访问页面中所有的标准组件DOM操作的分类 核心-DOM: DOM Co ...

  2. 解密jQuery内核 DOM操作

    jQuery针对DOM操作的插入的方法有大概10种 append.prepend.before.after.replaceWith appendTo.prependTo.insertBefore.in ...

  3. 第3章 jQuery的DOM操作

    一.  DOM 分为DOM核心,HTML-DOM和CSS-DOM 1.DOM核心 不专属与javascript. 获取对象:document.getElementsByTagName('div') 获 ...

  4. jQuery – 3.JQuery的Dom操作

    3.1 JQuery的Dom操作     1.使用html()方法读取或者设置元素的innerHTML    2.使用text()方法读取或者设置元素的innerText     3.使用attr() ...

  5. js，jQuery和DOM操作的总结（二）

    jQuery的基本操作 (1)遍历键值对和数组 , , , , , ]; $.map(arr, function (ele, index) { alert(ele + '===' + index); ...

  6. 03-老马jQuery教程-DOM操作

    jQuery DOM操作 在没有jQuery之前,DOM的操作相对来说有点麻烦,尤其是DOM节点的搜索.目前我们已经学习了jQuery的选择器,接下带大家一块学习jQuery的DOM操作,jQuery ...

  7. Jquery所有Dom操作汇总

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. HTML 学习笔记 JQuery（DOM 操作）

    一般来说,DOM操作分为三个方面,即:DOM Core(核心), HTML_DOM 和 CSS_DOM. 1.DOM Core DOM Core 并不专属于JavaScript,任何一种支持DOM的程 ...

  9. 解密jQuery内核 DOM操作的核心函数domManip

    domManip是什么 dom即Dom元素,Manip是Manipulate的缩写,连在一起就是Dom操作的意思. .domManip()是jQuery DOM操作的核心函数 对封装的节点操作做了参数 ...

  10. 解密jQuery内核 DOM操作的核心buildFragment

    文档碎片是什么 http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#ID-B63ED1A3 DocumentFragment is a & ...

随机推荐

  1. kickstart 实现批量安装centos7.x系统

    1.1 安装系统的方法 l  光盘(ISO文件,光盘的镜像文件)===>>每一台物理机都得给一个光驱,如果用外置光驱的话,是不是每台机器都需要插一下 l  U盘:ISO镜像刻录到U盘==& ...

  2. Win32 SDK 编程开始, 创建窗口, 消息的处理, 消息循环

    Windows SDK 编程的一般步骤为: 1. 注册窗口类, 使用到的结构 WNDCLASSEX, 函数 RegisterClassEx. 2. 创建窗口, 函数 CreateWindowEx. 3 ...

  3. insert时报Cannot add or update a child row: a foreign key constraint fails (`yanchangzichan`.`productstatusrecord`, CONSTRAINT `p_cu` FOREIGN KEY (`cid`) REFERENCES `customer` (`cid`))错误

    mybatis在insert时报Cannot add or update a child row: a foreign key constraint fails (`yanchangzichan`.` ...

  4. nodejs+mongoose+websocket搭建xxx聊天室

    简介 本文是由nodejs+mongoose+websocket打造的一个即时聊天系统:本来打算开发一个类似于网页QQ类似功能的聊天系统,但是目前只是开发了一个模块功能 --- 类似群聊的,即一对多的 ...

  5. ExceptionLess 本地部署小结

    ExceptionLess 是一个免费开源分布式系统日志收集框架,地址:https://github.com/exceptionless/Exceptionless 运行环境: .NET 4.6.1 ...

  6. 在没有DOM操作的日子里，我是怎么熬过来的（中）

    前言 继上篇推送之后,在掘金.segmentfault.简书.博客园等平台上迅速收到了不俗的反馈,大部分网友都留言说感同身受,还有不少网友追问中篇何时更新.于是,闰土顺应呼声,在这个凛冽的寒冬早晨,将 ...

  7. 五、Hadoop学习笔记————调优之硬件选择

    ResourceManageer服务器需要选择性能较好的 若有1TB数据,每天增量为10GB,则需要预留17.8TB,*3是因为有三分备份,*1.3是因为还需要预留出空间给操作系统等等 若集群在三十台 ...

  8. APP加固技术历程及未来级别方案：虚机源码保护

    传统App加固技术,前后经历了四代技术变更,保护级别每一代都有所提升,但其固有的安全缺陷和兼容性问题始终未能得到解决.而下一代加固技术-虚机源码保护,适用代码类型更广泛,App保护级别更高,兼容性更强 ...

  9. CNN网络介绍与实践：王者荣耀英雄图片识别

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者介绍:高成才,腾讯Android开发工程师,2016.4月校招加入腾讯,主要负责企鹅电竞推流SDK.企鹅电竞APP的功能开发和技术优化工作 ...

  10. 问题记录-运行Tomcat，项目程序没有响应

    问题描述:运行Tomcat,项目程序没有响应原因在于 修改成一致路径即可解决.