jQuery创建DOM元素实例解析

 更新时间:2015年01月19日 10:55:59   投稿:shichen2014  
这篇文章主要介绍了jQuery创建DOM元素的方法,实例分析了jQuery使用$直接创建DOM元素的技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了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中DOM事件冒泡实例分析

    这篇文章主要介绍了JQuery中DOM事件冒泡用法,实例分析了事件冒泡的原理与阻止冒泡的方法,需要的朋友可以参考下
    2015-06-06
  • jquery向上向下取整适合分页查询

    jquery向上向下取整适合分页查询

    这篇文章主要介绍了jquery向上向下取整适合分页查询及四舍五入,需要的朋友可以参考下
    2014-09-09
  • 使用jQuery获得内容以及内容的属性

    使用jQuery获得内容以及内容的属性

    本文给大家分享的是一则使用jQuery获得内容以及内容的属性的方法和示例,非常实用,推荐给大家。
    2015-02-02
  • 动态加载jQuery的两种方法实例分析

    动态加载jQuery的两种方法实例分析

    这篇文章主要介绍了动态加载jQuery的两种方法,实例分析了jquery动态加载的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-07-07
  • Jquery uploadify上传插件使用详解

    Jquery uploadify上传插件使用详解

    这篇文章主要介绍了JQuery上传插件Uploadify使用,文章给出详细的步骤来实现一个简单的上传功能,感兴趣的小伙伴们可以参考一下
    2016-01-01
  • EasyUI中实现form表单提交的示例分享

    EasyUI中实现form表单提交的示例分享

    这里给大家分享的是一段使用EasyUI中实现form表单提交的方法的核心代码,小伙伴们根据自己的需求补全form部分吧,希望大家能够喜欢。
    2015-03-03
  • jQuery使用之设置元素样式用法实例

    jQuery使用之设置元素样式用法实例

    这篇文章主要介绍了jQuery使用之设置元素样式用法,实例分析了jQuery如何设置页面的样式风格,包括添加、删除、动态切换等的使用技巧,需要的朋友可以参考下
    2015-01-01
  • jQuery入门 构造函数

    jQuery入门 构造函数

    jQuery入门 构造函数,需要的朋友可以参考下。
    2009-10-10
  • jQuery使用bind函数实现绑定多个事件的方法

    jQuery使用bind函数实现绑定多个事件的方法

    这篇文章主要介绍了jQuery使用bind函数实现绑定多个事件的方法,结合简单实例形式分析了jQuery使用bind函数进行多个事件绑定的操作技巧与注意事项,需要的朋友可以参考下
    2017-10-10
  • jquery点赞功能实现代码 点个赞吧!

    jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05

最新评论