jQuery中的元素添加操作

jQuery中常见的添加操作分为三类:
1、内部添加
2、外部添加
3、包裹

第一种:
内部添加:是指向已有的标签内部添加新的元素
代码演示


<html>
	<head>
		<meta charset="UTF-8">
		<title>title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" >script>
	head>
	<body>
		<div id="id">
			<span>zzdxspan>
		div>
		
		<script>
			$("#id").prepend("zzu");//向id名为id的元素后面添加"zzu"元素(在div内部)
			$("#id").append("zzu");//向id名为id的元素前面添加"zzu"元素(在div内部)
		script>
	body>
html>

在这里插入图片描述

第二种:
外部添加:是指向已有的同级标签外部前后添加新的元素
代码演示


<html>
	<head>
		<meta charset="UTF-8">
		<title>title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" >script>
	head>
	<body>
		<div id="id">
			<span>zzdxspan>
		div>
		
		<script>
			$("#id").after("zzu");//向id名为id的元素后面添加"zzu"元素(在div外部)
			$("#id").before("zzu");//向id名为id的元素后面添加"zzu"元素(在div外部)
		script>
	body>
html>

在这里插入图片描述

第二种:
包裹:用其他元素将已有元素包裹起来
代码演示


<html>
	<head>
		<meta charset="UTF-8">
		<title>title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" >script>
	head>
	<body>
		<img src="img/猴.gif"/>
		<script>
			$("img").wrap("");//用a标签将原有的img标签包裹起来
		script>
	body>
html>

你可能感兴趣的:(jQuery中的元素添加操作)