jQuery使用after()方法在元素后面添加多项内容的方法

本文实例讲述了jQuery使用after()方法在元素后面添加多项内容的方法。分享给大家供大家参考。具体分析如下：

jQuery可通过after()方法在元素后面添加多项内容，after()可以带多个参数，在指定元素后面添加多项内容

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
function afterText()
{
var txt1="<b>I </b>"; // Create element with HTML
var txt2=$("<i></i>").text("love "); // Create with jQuery
var txt3=document.createElement("big"); // Create with DOM
txt3.innerHTML="jQuery!";
$("img").after(txt1,txt2,txt3); // Insert new elements after img
}
</script>
</head>
<body>
<img src="/images/w3jquery.gif" alt="jQuery" width="100" height="140">
<br><br>
<button onclick="afterText()">Insert after</button>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

赞 (0)

相关推荐

  • jQuery中prepend()方法用法实例

    本文实例讲述了jQuery中prepend()方法用法.分享给大家供大家参考.具体分析如下: 此方法可向所有匹配元素的内部的前面追加HTML内容. 特别说明: 此方法是追加内容,也就是原来的内容还在. HTML内容就是内容中可以包含HTML标签,并且能够被浏览器渲染. 文本内容是先将内容中的html预定义字符转换成html字符实体,这样html标签就不会被渲染. 语法结构: 复制代码 代码如下: $(selector).prepend(content) 实例代码: 实例一: 复制代码 代码如下:

  • jQuery使用append在html元素后同时添加多项内容的方法

    本文实例讲述了jQuery使用append在html元素后同时添加多项内容的方法.分享给大家供大家参考.具体分析如下: 下面的代码可以同时在文本段落后添加多项内容 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> function appendText() { var txt1="<p&g

  • jQuery给多个不同元素添加class样式的方法

    本文实例讲述了jQuery给多个不同元素添加class样式的方法.分享给大家供大家参考.具体分析如下: jQuery可以通过addClass()方法给多个不同的html元素同时添加相同的class <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){

  • jQuery 追加元素的方法如append、prepend、before

    jQuery 追加元素的方法如append、prepend、before

    1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 $("p").append("Some appended text."); 2.jQuery prepend() 方法 jQuery prepend() 方法在被选元素的开头插入内容. 实例 $("p").prepend("Some prepended text."); 3.after() 和 before() 方法

  • jQuery使用prepend()方法在元素前添加内容用法实例

    本文实例讲述了jQuery使用prepend()方法在元素前添加内容的用法.分享给大家供大家参考.具体分析如下: 下面的代码可实现在文本前和列表前添加新的元素 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1"

  • jQuery使用before()和after()在元素前后添加内容的方法

    本文实例讲述了jQuery使用before()和after()在元素前后添加内容的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1").click(function()

  • jQuery使用after()方法在元素后面添加多项内容的方法

    本文实例讲述了jQuery使用after()方法在元素后面添加多项内容的方法.分享给大家供大家参考.具体分析如下: jQuery可通过after()方法在元素后面添加多项内容,after()可以带多个参数,在指定元素后面添加多项内容 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> function af

  • jQuery页面元素动态添加后绑定事件丢失方法,非 live

    代码1: 以此方法绑定的input框事件,在通过add按钮后用jquery绑定的事件 alert就会丢失 <input type="button" value="Add" name="test_but" /> <div id="test_div"><input name="test_input"/></div> <script> $('input[

  • Android如何给Textview添加菜单项详解(Java)

    Android如何给Textview添加菜单项详解(Java)

    目录 背景描述: 解决办法 具体步骤: 1.创建菜单文件 2.给activity添加菜单,重写菜单监听事件 3. 给控件添加菜单响应属性 总结 背景描述: 界面上有一个Textview和一个Button,当我们点击Textview时会弹出一个菜单,然后我们选择一个选项,最后点击按钮的时候,就会根据选择的菜单项执行相应的函数. 解决办法 总共分三个步骤: 1.首先在res文件夹下创建menu文件夹,然后创建菜单文件main.xml 2.在Activity中添加菜单,具体怎么添加,先定义菜单按钮 P

  • jQuery实现在新增加的元素上添加事件方法案例分析

    本文实例讲述了jQuery实现在新增加的元素上添加事件方法.分享给大家供大家参考,具体如下: 最近项目组需要在新增的元素上增加时间,有人说用live方法后来使用的时候发现jQuery没有该方法(1.7以上就没了)替换为on 除了jquery api官方的例子外还有以下的例子可以在新增的元素上添加事件 $(document).on("click",'#lyysb a',function(){ if(!$(this).hasClass('cur')){ $(this).addClass('

  • jQuery使用addClass()方法给元素添加多个class样式

    本文实例讲述了jQuery使用addClass()方法给元素添加多个class样式的方法.分享给大家供大家参考.具体如下: jQuery通过addClass()方法给元素添加多个class,只需要在添加的class中用空格分开多个class既可 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(doc

  • jQuery实现标签子元素的添加和赋值方法

    一.在jsp页面中定义<select>标签,如下: <div> <span>科室:</span> <select class="dept-name-show" style="width: 70%;"> </select> </div> 二.编写js语句: <script> $(function () { var dname = $(".dept-name-sho

随机推荐