jQuery操作DOM知识总结
jquery操作DOM(节点)
1.创建元素
//$(htmlStr)
//htmlStr:html格式的字符串
$("<span>这是一个span元素</span>");
2.添加元素
2.1.添加新建的元素
//方法一:将jQuery对象添加到调用者内部的最后面。
var $span = $("<span>这是一个span元素</span>");
$("div").append($span);
//方法二:参数传字符串,会自动创建成jquery对象
$("div").append("<span>这是一个span元素</span>");
2.2.添加已经存在的元素
var $p = $("p");
$("div").append($p);
//注意:如果添加的是已经存在的元素,那么会把之前的元素给干掉。
//(类似于剪切的功能)。
类似的用法
append
会将元素添加到子元素的最后面prepend
会将元素添加到子元素的最前面after
会将元素添加到该元素的后面before
会将元素添加到该元素的前面 【案例:城市选择】(../Example/12 城市选择案例.html)
2.3.使用html方法创建元素
//设置内容
$("div").html("<span>这是一段内容</span>");
//获取内容
$("div").html()
3.清空元素
empty
:清空指定节点的所有元素,自身保留(清理门户)
$("div").empty();
//清空div的所有内容(推荐使用,会清除子元素上绑定的内容,源码)
清空元素的第二种方法
$("div").html("");
//使用html方法来清空元素,不推荐使用,会造成内存泄漏,绑定的事件不会被清除。
4.删除元素
remove
:相比于empty
,自身也删除(自杀)
$("div").remove();
5.克隆元素
作用:复制匹配的元素
// 复制$(selector)所匹配到的元素(深度复制)
//cloneNode(true)
// 返回值为复制的新元素,和原来的元素没有任何关系了。即修改新元素,不会影响到原来的元素。
$(selector).clone();
jQuery操作DOM知识总结的更多相关文章
- Hybrid App开发之jQuery操作DOM
前言: 前面学习了JQuery的选择器,今天开始学习新的知识,JQuery操作DOM元素. 元素属性的访问与设置 attr(name) 获取元素属性 attr(name,value) 单个属性设置 a ...
- jQuery操作Dom、jQuery事件机制、jQuery补充部分
jQuery操作Dom: 修改属性: //使用attr()方法 //attr(name, value) //name:要修改的属性的属性名 //value:对应的值 //attr方法,如果当前标签有要 ...
- web进阶之jQuery操作DOM元素&&MySQL记录操作&&PHP面向对象学习笔记
hi 保持学习数量和质量 1.jQuery操作DOM元素 ----使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,a ...
- jQuery框架-2.jQuery操作DOM节点与jQuery.ajax方法
一.jQuery操作DOM 内部插入操作: append(content|fn):向每个匹配的元素内部追加内容. prepend(content):向每个匹配的元素内部前置内容. 外部插入操作: af ...
- 第四章 使用jQuery操作DOM
第四章 使用jQuery操作DOM 一.DOM操作 在jQuery中的DOM操作主要可分为样式操作.文本和value属性值操作.节点操作: 节点操作又包含属性操作.节点遍历和CSS-DOM操作. 其中 ...
- 原生JS和jQuery操作DOM的区别小结
一.Js原生对象和jQuery实例对象的相互转化: (1).原生JS对象转JQ对象: $(DOM对象); (2). JQ对象转原生JS对象: $(DOM对象).get(index); //注意区分eq ...
- jQuery权威指南(第2版) 学习一 jQuery操作DOM
jQuery操作DOM 获取元素的属性 attr(name) 获取元素属性的语法格式如下: attr(name) 其中,参数 name 表示属性的名称. 例子: <img alt="& ...
- *jquery操作DOM总结 (原创:最全、最系统、实例展示)
jquery操作DOM包括八个方面: 一:jquery对DOM节点的基本操作:二:jquery对DOM节点的CSS样式操作:三:jquery遍历DOM节点:四:jquery创建DOM节点:五:jque ...
- jQuery操作dom事件
参考:jQuery权威指南jQuery初步jQuery选择器jQuery操作domjQuery操作dom事件jQuery插件jQuery操作AjaxjQuery动画与特效jQuery实现导航栏jQue ...
随机推荐
- 团体程序设计天梯赛-练习集-L1-041. 寻找250
L1-041. 寻找250 对方不想和你说话,并向你扔了一串数…… 而你必须从这一串数字中找到“250”这个高大上的感人数字. 输入格式: 输入在一行中给出不知道多少个绝对值不超过1000的整数,其中 ...
- Day 17 time,datetime,random,os,sys,json,pickle
time模块 1.作用:打印时间,需要时间的地方,暂停程序的功能 时间戳形式 time.time() # 1560129555.4663873(python中从1970年开始计算过去了多少秒) 格式化 ...
- MATLAB图形界面设计(上)
参考https://www.cnblogs.com/BlueMountain-HaggenDazs/p/4307777.html 一.图形句柄 1.定义 MATLAB在创建每一个图形对象时,都会给该对 ...
- swift-UITableView的基本使用
废话不多说了,直接贴我今天写的代码吧:如果新手有什么不懂的,可以发我邮箱. // // singleInfo.swift 个人信息 // Housekeeper // // ...
- [CodeForces]1059C Sequence Transformation
构造题. 我递归构造的,发现如果N>3的话就优先删奇数,然后就把删完的提取一个公约数2,再重复操作即可. 具体原因我觉得是因为对于一个长度大于3的序列,2的倍数总是最多,要令字典序最大,所以就把 ...
- 9.在idea中创建Maven项目
1.新建maven WEB项目 打开-File-New-Project 点击NEXT 2.选择项目组,并给项目命名 3.选择maven路径 添加的配置为 archetypeCatalog=intern ...
- jQuery动态效果
1.一号店首页 2.淘宝网购物车
- sqlalchemy根据表名动态创建model类
作用如题,直接上代码吧,另外还支持 copy一张表的表结构,新建表并获得model对象 # coding: utf-8 import traceback from sqlalchemy import ...
- 数据库--ACID特性
事务的ACID属性 原子性(Atomicity) 原子性是指事务是一个不可分割的工作单位,事务中的操作要么都发生,要么都不发生. 一致性(Consistency) 事务必须使数据库从一个一致性状态变换 ...
- MySQL优化之——为用户开通mysql权限
转载请注明出处:http://blog.csdn.net/l1028386804/article/details/46627263 为用户开通mysql权限: grant all privileges ...