您的位置:首页 > Web前端 > JQuery

jQuery系列之添加元素或文本+jQ操作(六)

2017-06-15 09:00 295 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="jquery-3.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".addText").click(function () {
$(this).append("append")
.prepend("prepend")
.before("<span>我是添加的元素span</span>")
.after("我是后入的文本");
});

$(".delEl").click(function () {
//                $(".addText").remove();
$(".addText").empty("span");
});

$("#btn1").mouseenter(function () {
$("#btn1").css({"background-color":"cyan", "color":"white"})
});

$("#btn1").mousedown(function () {
$("#btn1").css({"background-color":"red", "color":"white"})
});
$("#btn1").mouseleave(function () {
$("#btn1").css({"background-color":"blue", "color":"white"})
});
$("#btn1").mouseup(function () {
$("#btn1").css({"background-color":"purple", "color":"white"})
});
$("#btn1").click(function () {
$("#btn1").click(function () {
$("#btn1").css({"background-color": "red", "color": "cyan"})
});

});
});
</script>
</head>
<body>

<button class="addText"><strong>添<span>加</span>文本</strong></button>
<button class="delEl">删除元素</button>
<button id="btn1">点我点我</button>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: