<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>b index</title>
<link rel=‘stylesheet‘ type="text/css" href=‘b/css/bootstrap.css‘>
</head>
<body style="margin:150px;">
<div id="div001">div001</div>
<div id="div002">div002</div>
<div id="div003">div003</div>
<p><span>Hello</span>,how are you?</p>
<div>
<button id="btn001">click me to replaceWith new paragraph</button>
<button id="btn002">click me to replaceWith div003</button>
<button id="btn003">click me to replaceWith all div with pibib</button>
<button id="btn004">click me to paragraph replaceAll div001 </button>
<button id="btn005">click me to paragraph replaceAll div001 use end </button>
<button id="btn006">click me to use end </button>
</div>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="b/js/bootstrap.js"></script>
<script type="text/javascript" src="js/index028.js"></script>
</body>
</html>
$(function() {
$(‘#btn001‘).click(btn001Click);
$(‘#btn002‘).click(btn002Click);
$(‘#btn003‘).click(btn003Click);
$(‘#btn004‘).click(btn004Click);
$(‘#btn005‘).click(btn005Click);
$(‘#btn006‘).click(btn006Click);
});
function btn001Click() {
// ‘<p>asdf‘这样的写法竟然也可以；
$(‘#div001‘).replaceWith(‘<p>asdf‘);
}
function btn002Click() {
$(‘#div001‘).replaceWith($(‘#div003‘));
}
function btn003Click() {
// ‘<p><i><b><i><b>asdf‘这样的写法，jQuery自己封口；
// 还能把错误的</ul>给删除掉；
$(‘div‘).replaceWith(‘<p><i><b></b></ul><i><b>asdf‘);
}
function btn004Click() {
// 在这里面"<p>thisispa"竟然是无效的；必须自己封口；
var res = $("<p>this is pa</p>").replaceAll($(‘#div001‘));
console.log(res);
// 不需要添加回去；
// $(‘#div002‘).before(res);
}
function btn005Click() {
// 用不用end()都会给替换掉；
var res = $("<p>this is use end</p>").replaceAll($(‘#div002‘)).end();
console.log(res);
}
function btn006Click() {
// obj2得到的竟然是[document]对象
var obj2 = $(‘p‘).end();
// obj得到的是[p]对象
var obj = $("p").find("span").end();
console.log(obj);
}
时间： 2024-08-07 03:10:19