添加内容

html

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8" />

		<title>jquery</title>

		<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>

		<script type="text/javascript" src="js/try.js" ></script>

	</head>

	<body>

		<p id="p1">hello</p>

		<button id="btn1">点击</button>

		<p id="p2">world</p>

		<button id="btn2">点击</button>

		<p id="p3">world</p>

		<button id="btn3">点击</button>

		<p id="p4">world</p>

		<button id="btn4">点击</button>

	</body>

</html>

　　js

$(document).ready(function(){

  $("#btn1").click(function(){

    $("#p1").append(" world");

    });

  $("#btn2").click(function(){

    $("#p2").prepend("hello ");

    });

    $("#btn3").click(function(){

    $("#p3").before("hello ");

    });

    $("#btn4").click(function(){

    $("#p4").after("hello ");

    });

});

　　效果:

2017-09-21   17:29:21

jQuery HTML- 添加元素的更多相关文章

  1. jquery动态添加元素无法触发绑定事件的解决方案。

    jquery动态添加元素无法触发绑定的事件的解决方案. ╭(●｀∀´●)╯二狗最近在工作中遇到一个问题,即当用jquery动态添加元素后,发现给动态添加的元素却无法触发事件(╯#-_-)╯╧═╧ ( ...

  2. jQuery动态添加元素事件

    在项目中遇到需要jQuery动态添加元素的事件,做了一个demo,方便以后遇到相同的问题可以用上: <!DOCTYPE html> <html> <head> &l ...

  3. jquery中添加元素append，prepend，before和after方法的区别

    append:在元素内部的最后面添加元素,作为子元素. prepend:在元素内部的最前面添加元素,作为子元素. before:在元素的前边,作为兄弟元素添加. after:在元素的后边,作为兄弟元素 ...

  4. jquery动态添加元素无法触发绑定的事件的解决方案

    方法一:绑定live事件(live事件只在jquery1.9以下才支持,高版本不支持). //jquery 1.9(不包括1.9)以下可以 $(".btn").live(" ...

  5. jQuery 新添加元素事件绑定无效

    jQuery中事件绑定,大多使用on就足够了. 但是对于新添加的元素 on 的绑定事件 会不起作用. 因为 append 中的 节点是在整个文档加载之后才添加的,页面并不会为未来的元素初始化添加点击事 ...

  6. Jquery动态添加元素并给元素增加onchange相应

    动态添加元素: $select = $("<select></select>"); $("<option></option> ...

  7. jQuery动态添加元素,并提交json格式数据到后台

    参考:https://www.cnblogs.com/shj-com/p/7878727.html 下载 下载该插件的地址是:http://www.bootcdn.cn/jquery.serializ ...

  8. jQuery动态添加元素并绑定事件

    写网页的时候常常需要根据实际情况添加新的元素,然后这些新元素还需要绑定已有的事件,如:有一ul,点击其中某 li,根据其 id 或 value 等获取新的数据列表,并新建 ul 显示,新 ul 中的 ...

  9. jquery新添加元素无法删除

    $("body").on('click',".delic",function(){ $(this).parent().remove(); })

  10. Jquery 动态添加元素后，获取不到元素对象情况

随机推荐

  1. $Dsu$ $on$ $Tree$ 复习

    \(Dsu\) \(on\) \(Tree\) 复习 发现最近有点头晕,突然这东西就不会了,头疼了很久,决定写一份记录啊. 大致认识 适用范围一般在处理树上子树统计问题,不支持在线回答询问以及修改. ...

  2. NCRE训练二

    package com.fei.ncre; import java.io.RandomAccessFile; /** * 该程序的功能是将本程序代码打印输出 */ public class Java_ ...

  3. spark的知识的链接

    IDEA 创建scala spark的Mvn项目:https://blog.csdn.net/u014646662/article/details/84618032 Spark详解03Job 物理执行 ...

  4. maven之可执行jar包

    在使idea创建springboot项目时,pom.xml文件中自动会添加下面这个插件. <build> <plugins> <plugin> <groupI ...

  5. Cent OS （三）vi文本编辑操作

    序号 命令 命令含义 1 echo            2 vi/vim    编辑 3 cat     cat 命令用于连接文件并打印到标准输出设备上. 4 more   分屏显示文本内容 5 l ...

  6. 彻底搞定C指针－函数名与函数指针

     函数名与函数指针 一 通常的函数调用 一个通常的函数调用的例子://自行包含头文件 void MyFun(int x); //此处的申明也可写成:void MyFun( int ); int mai ...

  7. apr not found，APR-util not found，pcre，

    1.下载所需软件包(此下载链接经由作者验证可使用): wget http://archive.apache.org/dist/apr/apr-1.4.5.tar.gz wget http://arch ...

  8. Maximum of lines in a DataBand

    Hello! I have a problem.I have a DataBand, but I need it to grow only up to 14 lines. If it is beyon ...

  9. The 13th Chinese Northeast Collegiate Programming Contest(B C E F H J)

    B. Balanced Diet 思路:把每一块选C个产生的价值记录下来,然后从小到大枚举C. #include<bits/stdc++.h> using namespace std; ; ...

  10. Cocos2d-x之Sound

    |   版权声明:本文为博主原创文章,未经博主允许不得转载. 音效简介: 1.1 在游戏开发的过程中除了华丽的界面,生动的动画之外,适当的音效也是重要的一部分 1.2 游戏中的声音分为两类,一类是音乐 ...