`
xiaomogu
  • 浏览: 51238 次
  • 性别: Icon_minigender_2
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

向页面添加元素

阅读更多
经常需要用这个方法,每次用都很纠结,需要总结一下:
1.原生js

document.body.appendChild(_left);
ppdom.parentNode.insertBefore(c,ppdom);
document.write(xxxx);


2.jQuery
var a = '<div id="wrap"></div>';
jQuery(a).appendTo(jQuery('body'));

//几种添加节点的方法
    //$("p").append("<b>你好吗?</b>");//向p元素中追加《b》
    //$("<b>你好吗?</b>").appendTo("p");//将《b》追加到p元素中
    //$("p").prepend("<b>你好吗?</b>");//向p中前置《b》
    //$("<b>你好吗?</b>").prependTo("p");//将《b》前置到p元素中
    //$("p").after("<b>你好吗?</b>");//向p元素后插入《b》
    //$("<b>你好吗?</b>").insertAfter("p");//将《b》插入到p元素后边
    //$("p").before("<b>你好吗?</b>");//在p元素之前添加《b》
    //$("<b>你好吗?</b>").insertBefore("p");//将《b》插入到p元素前面
  
  
      //几种删除节点的方法
    //var $li=$("ul li:eq(1)").remove();//删除ul节点中第2个元素节点
    //$("ul").append($li);//把刚删除的元素节点从新添加到ul元素中去
    //$("ul li").remove("li[title!=菠萝]");//将ul元素下title属性不等于"菠萝"的li元素删除
    //$("ul li:eq(1)").empty();//清空ul节点下第2个li元素的内容
  
    //复制节点
   /* $("ul li").click(function(){
     $(this).clone(true).appendTo("ul");//复制当前点击的节点,并将它追加到《ul》元素中,当添加参数时复制它的事件
  
    });
    */
    //替换节点
   // $("p").replaceWith("<strong>你最不喜欢的水果是?</Strong>");
  
分享到:
评论

相关推荐

    Jquery子页面获取父页面元素,子页面向父页面添加元素

    父页面动态的获取子页面的元素,以及弹出子页面的时候获取父页面的元素;

    页面滚动时为元素动态添加class类的jquery插件

    - `direction`:控制元素是向上还是向下进入视口时添加class,可能的值为`'top'`或`'bottom'`。 - `duration`:元素保持class的时间,单位为毫秒。 具体的配置项应参考插件的文档或源码以获取最准确的信息。 ### ...

    unigrid添加html5 dom元素.rar

    标题"unigrid添加html5 dom元素.rar"暗示了这个压缩包可能包含一个教程或代码示例,指导如何在使用Unigrid组件的Delphi项目中集成HTML5 DOM元素。Unigrid是Delphi中用于显示和编辑表格数据的第三方组件,它允许...

    javascript动态生成页面元素

    在现代Web开发中,JavaScript作为前端开发的核心语言之一,其动态生成页面元素的能力是构建交互式网站的关键技术。本文将深入探讨如何利用JavaScript动态生成HTML页面元素,包括使用innerHTML属性和DOM(Document ...

    页面div拖动交换位置,动态添加删除页面元素

    在网页开发中,实现页面元素如`div`的拖动交换位置以及动态添加删除功能,是一种常见的交互设计,可以提高用户的操作体验。本项目通过利用JavaScript库jQuery和jQuery UI,结合CSS样式,实现了这一功能。 首先,...

    WebSelenium_页面和元素封装

    - 错误处理:在封装过程中,可以添加异常处理机制,比如元素找不到或页面加载超时等情况,以增强测试脚本的健壮性。 4. 示例代码: ```python class LoginPage: def __init__(self, driver): self.driver = ...

    动态添加删除表单元素

    总结,动态添加删除表单元素是提升网页交互性的重要手段,通过JavaScript的DOM操作,我们可以灵活地管理页面上的表单元素,实现动态的用户界面。理解并掌握这一技术,对于前端开发者来说,无疑会增强其在实际项目中...

    jQuery为动态生成的select元素添加事件的方法

    6. 动态添加元素到页面中:在需要的时候,使用jQuery的`.append()`方法将创建好的select元素添加到页面的指定容器中。这个操作会把新的HTML字符串插入到页面的DOM中,从而使得select元素变得可用。 7. 绑定事件到...

    解决layui动态添加的元素click等事件触发不了的问题

    在页面加载完成时候 ‘.add_project’ 元素是可以触发click时间的,当动态添加 ‘.add_project’ 时候,新添加的元素却触发不了click事件,类似下面的写法: $(".add_project").on('click', function(){ alert&#40...

    动态添加style元素

    在前端开发中,有时我们需要在运行时动态地向页面中添加样式,这通常涉及到JavaScript操作DOM(Document Object Model)以及CSS(Cascading Style Sheets)。动态添加`&lt;style&gt;`元素是一种常见的方式,它允许我们在不...

    jQuery实现页面滚动时元素智能定位

    6. **处理边界情况**:考虑到屏幕大小变化和不同设备的差异,可能需要添加额外的条件判断,确保元素在接近页面边界时依然表现正常。 7. **优化性能**:为了防止过度渲染,可以使用`throttle`或`debounce`函数限制...

    web页面添加水印-自定义

    在网页设计中,有时我们需要为页面添加自定义的水印效果,这通常是为了保护版权、增强品牌识别度或提供特定的提示信息。本教程将详细讲解如何使用JavaScript(js)来实现这一功能,以及如何通过提供的压缩包文件...

    jquery添加和删除元素

    添加元素: 在jQuery中,我们通常使用`append()`和`prepend()`方法来向已存在的元素内部添加新的内容。`append()`会在被选元素的末尾添加内容,而`prepend()`则会在开头添加。例如,假设我们有一个空的`&lt;div&gt;`元素,...

    运行时动态添加和删除页面ViewPagerDemo

    6. **页面滑动动画**:如果需要,还可以自定义滑动动画,使页面添加和删除更加平滑,增强用户体验。 在提供的`ViewPagerDemo`中,应该包含了实现这些功能的源代码,包括Activity、PagerAdapter的实现以及用户交互...

    js动态的添加元素例如表格1

    * 在添加元素时,需要确保新的元素是有效的 HTML 代码,以免影响页面的结构和样式。 JavaScript 动态添加元素技术可以帮助开发者创建更加动态和交互的 Web 应用程序。但是,需要根据实际情况选择合适的方法,并注意...

    元素随页面下拉向下运动

    实现元素随网页下拉向下运动,修改图片区内容,添加图片大小,修改坐标,都在添加图片区内

    Qt界面中添加设计好的子页面

    ### Qt界面中添加设计好的子页面 在进行Qt应用程序开发时,经常遇到界面设计中存在大量重复元素的情况,为了提高开发效率,降低出错率,合理地复用这些设计是十分必要的。本篇文章将详细介绍如何在Qt界面中添加设计...

    页面滚动时动态为元素添加class的jQuery插件

    `jQuery.scrollAnimations` 就是这样一款插件,它允许我们在用户滚动页面时,根据元素进入浏览器视口的状态,动态地为这些元素添加特定的CSS类,从而触发预先定义的动画效果。这款插件与流行的`animate.css`库配合...

    JS简单添加元素新节点的方法示例

    本示例主要讲解了如何使用JavaScript来创建、添加和克隆页面元素节点,这些都是前端开发中常见的操作。下面将详细解析这些方法: 首先,我们获取页面上的某个特定元素。在这个例子中,我们通过`getElementById`方法...

Global site tag (gtag.js) - Google Analytics