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. Lucene全文检索学习笔记

    全文索引 介绍Lucene的作者:Lucene的贡献者Doug Cutting是 一位资深全文索引/检索专家,曾经是V-Twin搜索引擎(Apple的Copland操作系统的成就之一)的主要开发者,后 ...

  2. C#读取数据库返回泛型集合(DataSetToList)

    一般我们用使用ADO.NET查询数据库返回泛型集合使用SqlDataReader逐行读取数据存入对象 代码 }

  3. WPF 完美截图 <一>

    最近比较懒,一直没继续,此处省略一万字,下面开始正题. 简单介绍下截图的思路: 核心是利用 public CroppedBitmap(BitmapSource source, Int32Rect so ...

  4. WPF学习之路一

    前段时间一直在学习MVC,工作需要,现在需要180度急转弯,搞WPF,MVVM,只能找资料学习了. WPF中有一个消息机制,就是当前台控件绑定的值改变时,会自动通知到指定的事件来改变VM的值,反之亦然 ...

  5. 如何从零开始对接第三方登录(Java版):QQ登录和微博登录

    前言 个人网站最近增加了评论功能,为了方便用户不用注册就可以评论,对接了QQ和微博这2大常用软件的一键登录,总的来说其实都挺简单的,可能会有一点小坑,但不算多,完整记录下来方便后来人快速对接. 后台设 ...

  6. Ubuntu安装pyenv实现多版本控制

    Ubuntu安装pyenv实现多版本控制 git clone git://github.com/yyuu/pyenv.git ~/.pyenv echo 'export PYENV_ROOT=&quo ...

  7. laravel whereDate()方法的使用

    今天在做日期查询,过过滤的时候,发现了一个问题,用where()语句,要求时间格式比较严格,比如你要查2017-09-23这一天的活动,你在输入框传入2017-09-23,系统会默认帮你补上后面缺少的 ...

  8. openFace 人脸识别框架测试

    openface  人脸识别框架  但个人感觉精度还是很一般 openface的githup文档地址:http://cmusatyalab.github.io/openface/ openface的安 ...

  9. 3721:和数-poj

    总时间限制:  1000ms 内存限制:  65536kB 描述 给定一个正整数序列,判断其中有多少个数,等于数列中其他两个数的和. 比如,对于数列1 2 3 4, 这个问题的答案就是2, 因为3 = ...

  10. 数据库—Mysql

    今天跟大家来聊聊Mysql,首先介绍一下它的历史: Mysql是一个关系型数据库管理系统,最先由瑞典的MySQL AB公司开发,后来被sun公司收购,后因sun公司又被Oracle公司收购,致使MyS ...