JQuery学习总结【二】

一:JQuery知识点

*:JQuery的dom操作

JQuery学习总结【二】

*:动态创建dom节点

比如动态创建表格等,在js里面进行完成。

JQuery学习总结【二】

*删除节点

JQuery学习总结【二】

这里面的删除就是将其放在了一个地方,并不是真的删除,之后可以使用。

*:document方法

1:.val()可以获取到文本框里面的值,若括号里面有值则直接为赋值。

Eg:加法计算器

<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script src="https://www.jb51.net/js/jquery-1.4.2-vsdoc.js"></script> <script src="https://www.jb51.net/js/jquery-1.4.2.js"></script> <script type="text/javascript"> $(function() { $("#buttons").click(function() { var tex1 = $("#tex1").val(); var tex2 = $("#tex2").val(); var tex3 = parseInt(tex1, 10) + parseInt(tex2,10); $("#tex3").val(tex3); }); }); </script> </head> <body> <input type="text"/><input type="button" value="+"/><input type="text"/> <input type="button" value="="/><input type="text"/> </body> </html>

JQuery学习总结【二】

2:可以通过attr属性来进行隐藏。

3:在jq里面通过下面的这种形式

(function());这是把一个(function());这是把一个()是让其在ready的时候执行,若是没有这个就是定义了一个方法。

Eg:阅读说明书

<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script src="https://www.jb51.net/js/jquery-1.4.2-vsdoc.js"></script> <script src="https://www.jb51.net/js/jquery-1.4.2.js"></script> <script type="text/javascript"> var leftSeconds = 10; var intarvalId; $(function() { $("#buttons").attr("disabled", true); intarvalId = setInterval("CountDom()", 1000); }); function CountDom() { if(leftSeconds<=0) { $("#buttons").val("同意"); $("#buttons").attr("disabled", false); clearInterval(intarvalId); return; } leftSeconds--; $("#buttons").val("请仔细阅读" + leftSeconds + "秒"); } </script> </head> <body> <textarea>在使用前请仔细阅读说明书。</textarea> <input type="button" value="同意"/> </body> </html>

Eg:无刷新评论

JQuery学习总结【二】

Eg::文本颜色变化

代码:

JQuery学习总结【二】

Eg:

代码:

JQuery学习总结【二】

*:节点替换

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwxzyz.html