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. [转载] NoSQL简介

    摘自“百度百科”. NoSQL,泛指非关系型的数据库.随着互联网web2.0网站的兴起,传统的关系数据库在应付web2.0网站,特别是超大规模和高并发的SNS类型的web2.0纯动态网站已经显得力不从 ...

  2. Django 入门案例开发（中）

    昨天已经描述了如何搭建Django的开发环境,今天描述业务流程,具体我们要实现一个什么样的业务: 以下的业务都是假设的(网上书店   页面做的low): 1.用户注册及登录业务: 这是一个网上书店阅读 ...

  3. .Net 多线程开发优化实践

    互联网产品中微服务.高并发已经成为最基本的要求.所谓高并发就是在同一时刻处理多个服务请求.为了提高高并发场景下的系统稳定性,负载均衡.消息队列等框架和技术应运而生,有效的缓解了高并发对系统整体压力.无 ...

  4. Redis Save 与 BGSAVE 的区别

    一,save保存数据到磁盘的方式: Redis Save 命令执行一个同步保存操作,将当前 Redis 实例的所有数据快照(snapshot)以 RDB 文件的形式保存到硬盘. 语法redis Sav ...

  5. Python 面向对象(三) 魔术方法

    __getitem__ 在对实例或对象使用索引访问时调用,self[key]__dir__ 收集当前模块的信息,包括继承自其它基类(包括object类)的属性和方法 __new 定义如何创建实例__i ...

  6. Python 面向对象(一) 基础

    Python 中一切皆对象 什么是面向对象? 面向对象就是将一些事物的共有特征抽象成类,从类来创建实例. 类class 可以理解为模版 比如人类,都具有身高.体重.年龄.性别.籍贯...等属性,但属性 ...

  7. 深入理解js中的apply、call、bind

    概述 js中的apply,call都是为了改变某个函数运行时的上下文环境而存在的,即改变函数内部的this指向. apply() apply 方法传入两个参数:一个是作为函数上下文的对象,另外一个是作 ...

  8. react入门到进阶（二）

    一.react属性与事件 1.State属性 State,翻译过来是状态的意思,所以它就代表着组件的状态.React把用户界面(UI)当做是状态机,想象它有不同的状态然后渲染这些状态,可以轻松让用户界 ...

  9. OC在终端编写和运行

    初学者如果想在终端写OC程序的话可以使用一下方法 1.编写.m文件 2.编译.m文件: cc -c 文件名.m 3.再执行: cc 文件名.o -framework Foundation 4. 执行a ...

  10. Linux系统bash shell之历史命令

    1.相关变量: HISTSIZE: 定义命令历史记录的条数 HISTFILE: 定义命令储存的文件,一般是 ~/.bash_history HISTFILESIZE: 定义了历史文件记录历史的条数 H ...