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>
相关文章推荐
- 2015-07-22 JQuery 第二课(JQ元素获取,添加,删除,判断,遍历,取值,样式设置,改变对象,切换)
- jQuery1.9为动态添加元素绑定事件以及获取和操作checkbox的选择属性11
- jQuery的DOM操作之添加元素和删除元素
- jQuery第二课 ——节点选择、元素创建与操作、包装对象、jq转原生js
- jquery的元素的文本内容与HTML内容操作的区别
- jquery 操作动态添加的元素
- 10014---jQuery--jQuery DOM 操作-添加元素
- jQ基础篇--用jQuery操作元素的属性与样式
- jQuery-对标签元素 文本操作-属性操作-文档的操作
- jQuery选择器 标签选择元素+css简单添加移除操作
- jquery 节点操作(动态创建元素/添加元素/清空元素/复制元素)
- web前端,jquery实现瀑布流总结7,jq动态添加div等元素
- mysql 数据库简单操作,文本添加元素
- jQuery操作表格元素,整体添加与删除
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式【转】
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
- VC2005:无法执行添加/移除操作,因为代码元素是只读的
- JQUERY找无规律元素文本的办法
- jQuery中操作元素节点appendTo()与prependTo()的区别
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式