jQuery基础之(四)jQuery创建DOM元素
利用DOM方法创建元素节点,通常要将document.createElement()、document.createTextNode()、appendChild()配合使用,十分麻烦。
而jQuery使用$就可以直接创建DOM元素
var oNewP = $("<p>使用jQuery创建的内容</p>");
以上代码等同于javascript
var oNewP2 = document.createElement("p");
var oText = document.createTextNode("这是使用javascript方法创建的内容");
oNewP2.appendChild(oText);
例:使用jQuery创建DOM
<script type="text/javascript">
$(function(){
var oNewP = $("<p>使用jQuery创建的内容</p>");
oNewP.insertAfter("#display"); //insertAfter方法
}) </script>
<div id="display"></div>
使用jQuery大大缩短了代码长度。节省了编写时间。
jQuery基础之(四)jQuery创建DOM元素的更多相关文章
- 获取jQuery对象的第N个DOM元素 && table常用css样式
获取jQuery对象的第N个DOM元素 1.$(selector).get(N-1) 2.$(selector)[N-1] 注意:.index()方法返回的是一个数,相当于C#中的IndexOf() ...
- 使用jQuery匹配文档中所有的li元素,返回一个jQuery对象,然后通过数组下标的方式读取jQuery集合中第1个DOM元素,此时返回的是DOM对象,然后调用DOM属性innerHTML,读取该元素 包含的文本信息
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery基础之获取和设置标签元素属性
jQuery基础之获取和设置标签元素属性方法,如下图: 代码实现: <script src="JS/jquery-1.12.4.min.js"></script& ...
- 动态创建dom元素
效果图如上所示: 思维nav:就相当于qq空间发表动态(说说),在输入框里输入内容,点击提交(发表),内容就呈现在下面的动态栏里.我这里是准备写一个招聘的app,大家可以随便想象下哪些情况会遇到动态创 ...
- jQuery使用(四):DOM操作之查找兄弟元素和父级元素
查找兄弟元素 向下查找兄弟元素 next() nextAll() nextUntil() 向上查找兄弟元素 prev() prevAll() prevUntil() 查找所有兄弟元素 siblings ...
- jQuery基础学习(三)—jQuery中的DOM操作
一.查找节点 查找属性节点: 通过jQuery的选择器来完成. 操作属性节点: 调用jQuery对象的attr()来获取它的属性值. 操作文本节点: 通过text()方法 ...
- 用jQuery绑定事件到动态创建的元素上
jQuery最常用的一个功能就是对DOM的操作,与之相关的比如对事件的绑定和Ajax动态内容加载.当我们绑定事件到Ajax load回来的内容上或其他动态创建的元素上时会发现事件没响应,和你预想的结果 ...
- Kendo UI for jQuery使用教程:小部件DOM元素结构
[Kendo UI for jQuery最新试用版下载] Kendo UI目前最新提供Kendo UI for jQuery.Kendo UI for Angular.Kendo UI Support ...
- jQuery 绑定事件到动态创建的元素上
在进入主题之前,我们先来看一个前台页面经常用到的功能:点击页面输入框时自动选择其中文本. 很容易想到利用输入框的focus事件,当输入框获得焦点时,再调用jQuery的select()方法. Okay ...
随机推荐
- 【开学季】自学嵌入式开发|四核开发板|4412开发板|ARM+Android+linux技术
淘宝店铺:迅为开发板http://arm-board.taobao.com 网站:http://www.topeetboard.com QQ咨询:2551456065 电话咨询:010-5895758 ...
- UEditor For ASP.Net Core Use Qiniu
UEditor For ASP.Net Core Use Qiniu 此项目为UEditor提供文件管理; 后端服务使用 ASP.Net Core; 使用七牛提供的云存储; 项目地址 https:// ...
- java使用HttpClient传输json格式的参数
最近的一个接口项目,传的参数要求是json,需要特殊处理一下. 重点是这两句话: httpPost.setHeader("Content-Type", "applicat ...
- 最小生成树 2429: [HAOI2006]聪明的猴子
BZOJ 2429: [HAOI2006]聪明的猴子 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 877 Solved: 566[Submit][ ...
- DFS cdoevs 3100 蜗牛
cdoevs 3100 蜗牛 时间限制: 1 s 空间限制: 32000 KB 题目等级 : 黄金 Gold 题目描述 Description 萨丽·斯内尔(Sally Snail,蜗牛)喜欢在 ...
- 2014 Super Training #10 D 花生的序列 --DP
原题: FZU 2170 http://acm.fzu.edu.cn/problem.php?pid=2170 这题确实是当时没读懂题目,连样例都没想通,所以没做了,所以还是感觉这样散漫的做不好,有些 ...
- 关于jQuery的一些实用代码
(1)修改默认编码:(将默认的utf-8,修改为GB2312) $.ajaxSetup({ ajaxSettings:{contentType:"application/x-www-from ...
- 集合框架学习笔记<三>
一些重要的区别 set与list的区别: set是无索引的,list是有索引的: ArrayList与LinkList的区别: 前者是基于数组实现的,后者是基于链表实现的: 两者的使用方法一样,但是在 ...
- 权限框架 - shiro 授权demo
之前说了权限认证,其实也就是登录验证身份 这次来说说shiro的授权 shiro可以针对角色授权,或者访问资源授权 两者都行,但是在如今的复杂系统中,当然使用后者,如果你是小系统或者私活的话,前者即可 ...
- KVM虚拟机网络基础及优化说明
一个完整的数据包从虚拟机到物理机的路径是: 虚拟机--QEMU虚拟网卡--虚拟化层--内核网桥--物理网卡 KVM的网络优化方案,总的来说,就是让虚拟机访问物理网卡的层数更少,直至对物理网卡的单独占领 ...