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. Python之os.fork

    [参考资料] http://www.01happy.com/python-fork-create-process/ http://www.python-course.eu/forking.php ht ...

  2. ANTS Performance Profiler 8：支持对Web请求、异步代码和WinRT的性能剖析

    下载与激活:http://download.csdn.net/detail/lone112/6734291 离线激活   位于英国的Red Gate Software有限公司最近发布了ANTS Per ...

  3. 使用 Rust 构建分布式 Key-Value Store

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 引子 构建一个分布式 Key-Value Store 并不是一件容易的事情,我们需要考虑很多的问题,首先就是我们的系统到底需要提供什么样的功能 ...

  4. 深入理解Java内置锁和显式锁

    synchronized and Reentrantlock 多线程编程中,当代码需要同步时我们会用到锁.Java为我们提供了内置锁(synchronized)和显式锁(ReentrantLock)两 ...

  5. 1455:An Easy Problem

    传送门:http://noi.openjudge.cn/ch0406/1455/ /-24作业 //#include "stdafx.h" #include<bits/std ...

  6. ASP.NET Core教程【三】实体字段属性、链接标签、并发数据异常、文件上传及读取

    前文索引:ASP.NET Core教程[二]从保存数据看Razor Page的特有属性与服务端验证ASP.NET Core教程[一]关于Razor Page的知识 实体字段属性 再来看看我们的实体类 ...

  7. 【笔记】web 的回流与重绘及优化

    最近看了幕课网 web 前端性能优化的课程,其中说到了浏览器的回流(reflow) 及 重绘(repaint).觉得以后面试或许会被问到所以做一下笔记: 课程从回流及重绘这两个点延伸出了一个知识点就是 ...

  8. CSS-笔记1-选择器与文本元素

    知识点一: CSS概念:CSS 指层叠样式表 (Cascading Style Sheets)(级联样式表) Css是用来美化html标签的,相当于页面化妆. 知识点二: 选择器格式与部分属性: 写法 ...

  9. 一次php涉及跨域功能的麻烦及解决方案

    一,功能及描述 1,在后台管理网站(php)admin.xxx.com(以下简称admin),上拉取并编辑aaa.xxx.com(php,以下简称aaa)上的图片及文件 2,file_get_cont ...

  10. 【转】npm包管理器那些事

    原文链接:http://www.cnblogs.com/shuoer/p/7782125.html npm包管理器那些事! 今天和朋友针对npm包全局安装和本地项目安装这个梗展开的激烈的讨论,故此做一 ...