jQuery-html()\u3001text()\u3001val()\u65b9\u6cd5<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Title<\/title>\n <script type=\"text\/javascript\" src=\"..\/script\/jquery-3.6.1.js\"><\/script>\n <script type=\"text\/javascript\">\n \/*\n jQuery \u5c5e\u6027\u64cd\u4f5c\n\n html() \u5b83\u53ef\u4ee5\u8bbe\u7f6e\u548c\u83b7\u53d6\u8d77\u59cb\u6807\u7b7e\u548c\u7ed3\u675f\u6807\u7b7e\u4e2d\u7684\u5185\u5bb9\u3002 \u8ddf dom \u5c5e\u6027 innerHTML \u4e00\u6837\u3002\n text() \u5b83\u53ef\u4ee5\u8bbe\u7f6e\u548c\u83b7\u53d6\u8d77\u59cb\u6807\u7b7e\u548c\u7ed3\u675f\u6807\u7b7e\u4e2d\u7684\u6587\u672c\u3002 \u8ddf dom \u5c5e\u6027 innerText \u4e00\u6837\u3002\n val() \u5b83\u53ef\u4ee5\u8bbe\u7f6e\u548c\u83b7\u53d6\u8868\u5355\u9879\u7684 value \u5c5e\u6027\u503c\u3002 \u8ddf dom \u5c5e\u6027 value \u4e00\u6837\n *\/\n\n $(function () {\n \/\/ \u4e0d\u4f20\u53c2\u6570\uff0c\u662f\u83b7\u53d6\uff0c\u4f20\u9012\u53c2\u6570\u662f\u8bbe\u7f6e\n alert($(\"div\").html()); \/\/ \u83b7\u53d6\n $(\"div\").html(\"<h1>\u6211\u662fdiv\u4e2d\u7684\u6807\u9898 1<\/h1>\"); \/\/ \u8bbe\u7f6e\n\n \/\/ \u4e0d\u4f20\u53c2\u6570\uff0c\u662f\u83b7\u53d6\uff0c\u4f20\u9012\u53c2\u6570\u662f\u8bbe\u7f6e\n alert($(\"div\").text()); \/\/ \u83b7\u53d6\n $(\"div\").text(\"<h1>\u6211\u662fdiv\u4e2d\u7684\u6807\u9898 1<\/h1>\"); \/\/ \u8bbe\u7f6e\n\n \/\/ \u4e0d\u4f20\u53c2\u6570\uff0c\u662f\u83b7\u53d6\uff0c\u4f20\u9012\u53c2\u6570\u662f\u8bbe\u7f6e\n $(\"button\").click(function () {\n alert($(\"#username\").val()) \/\/ \u83b7\u53d6\n $(\"#username\").val(\"\u8d85\u7ea7\u7a0b\u5e8f\u733f\"); \/\/ \u8bbe\u7f6e\n })\n })\n <\/script>\n<\/head>\n<body>\n <div>\u6211\u662fdiv\u6807\u7b7e<span>\u6211\u662fdiv\u4e2d\u7684span<\/span><\/div>\n <input type=\"text\" name=\"username\" id=\"username\" \/>\n <button>\u64cd\u4f5c\u8f93\u5165\u6846<\/button>\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Title<\/title>\n<\/head>\n<body>\n<!DOCTYPE html>\n<html lang=\"zh_CN\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Title<\/title>\n <script type=\"text\/javascript\" src=\"..\/script\/jquery-1.7.2.js\"><\/script>\n <script type=\"text\/javascript\">\n \/*\n val() \u5b83\u53ef\u4ee5\u8bbe\u7f6e\u548c\u83b7\u53d6\u8868\u5355\u9879\u7684 value \u5c5e\u6027\u503c\u3002 \u8ddf dom \u5c5e\u6027 value \u4e00\u6837\n\n val \u65b9\u6cd5\u540c\u65f6\u8bbe\u7f6e\u591a\u4e2a\u8868\u5355\u9879\u7684\u9009\u4e2d\u72b6\u6001\uff1a\n *\/\n\n $(function () {\n \/\/ \u6279\u91cf\u64cd\u4f5c\u5355\u9009\n $(\":radio\").val([\"radio1\"]);\n \/\/ \u6279\u91cf\u64cd\u4f5c\u590d\u9009\u6846\u7684\u9009\u4e2d\u72b6\u6001\n $(\":checkbox\").val([\"checkbox3\",\"checkbox1\",\"checkbox2\"]);\n \/\/ \u6279\u91cf\u64cd\u4f5c\u591a\u9009\u7684\u4e0b\u62c9\u6846\u9009\u4e2d\u72b6\u6001\n $(\"#multiple\").val([\"mul2\",\"mul3\",\"mul4\"])\n \/\/ \u64cd\u4f5c\u5355\u9009\u7684\u4e0b\u62c9\u6846\u9009\u4e2d\u72b6\u6001\n $(\"#single\").val([\"sin2\"]);\n\n $(\":radio,:checkbox,#multiple,#single\").val([\"radio2\",\"checkbox1\",\"checkbox3\",\"mul1\",\"mul4\",\"sin3\"]);\n\n });\n <\/script>\n<\/head>\n<body>\n\u5355\u9009\uff1a\n<input name=\"radio\" type=\"radio\" value=\"radio1\"\/>radio1\n<input name=\"radio\" type=\"radio\" value=\"radio2\"\/>radio2\n<br\/>\n\u591a\u9009\uff1a\n<input name=\"checkbox\" type=\"checkbox\" value=\"checkbox1\"\/>checkbox1\n<input name=\"checkbox\" type=\"checkbox\" value=\"checkbox2\"\/>checkbox2\n<input name=\"checkbox\" type=\"checkbox\" value=\"checkbox3\"\/>checkbox3\n<br\/>\n\u4e0b\u62c9\u591a\u9009 \uff1a\n<select id=\"multiple\" multiple=\"multiple\" size=\"4\">\n <option value=\"mul1\">mul1<\/option>\n <option value=\"mul2\">mul2<\/option>\n <option value=\"mul3\">mul3<\/option>\n <option value=\"mul4\">mul4<\/option>\n<\/select>\n<br\/>\n\u4e0b\u62c9\u5355\u9009 \uff1a\n<select id=\"single\">\n <option value=\"sin1\">sin1<\/option>\n <option value=\"sin2\">sin2<\/option>\n <option value=\"sin3\">sin3<\/option>\n<\/select>\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-attr() \u548c prop() \u65b9\u6cd5<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Title<\/title>\n<\/head>\n<body>\n<!DOCTYPE html>\n<html lang=\"zh_CN\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Title<\/title>\n <script type=\"text\/javascript\" src=\"..\/script\/jquery-1.7.2.js\"><\/script>\n <script type=\"text\/javascript\">\n \/*\n attr() \u53ef\u4ee5\u8bbe\u7f6e\u548c\u83b7\u53d6\u5c5e\u6027\u7684\u503c\uff0c\u4e0d\u63a8\u8350\u64cd\u4f5c checked\u3001readOnly\u3001selected\u3001disabled \u7b49\u7b49\n attr \u65b9\u6cd5\u8fd8\u53ef\u4ee5\u64cd\u4f5c\u975e\u6807\u51c6\u7684\u5c5e\u6027\u3002\u6bd4\u5982\u81ea\u5b9a\u4e49\u5c5e\u6027\uff1aabc,bbj\n\n prop() \u53ef\u4ee5\u8bbe\u7f6e\u548c\u83b7\u53d6\u5c5e\u6027\u7684\u503c,\u53ea\u63a8\u8350\u64cd\u4f5c checked\u3001readOnly\u3001selected\u3001disabled \u7b49\u7b49\n *\/\n\n $(function () {\n \/\/attr\n alert($(\":checkbox:first\").attr(\"name\")); \/\/ \u83b7\u53d6\n $(\":checkbox:first\").attr(\"name\",\"abc\"); \/\/ \u8bbe\u7f6e\n\n \/\/ alert($(\":checkbox\").attr(\"checked\")); \/\/ \u5b98\u65b9\u89c9\u5f97\u8fd4\u56deundefined\u662f\u4e00\u4e2a\u9519\u8bef\n alert($(\":checkbox\").prop(\"checked\"));\n $(\":checkbox\").prop(\"checked\",false);\n\n $(\":checkbox:first\").attr(\"abc\",\"abcValue\");\n alert($(\":checkbox:first\").attr(\"abc\"));\n });\n <\/script>\n<\/head>\n<body>\n<br\/>\n\u591a\u9009\uff1a\n<input name=\"checkbox\" type=\"checkbox\" checked=\"checked\" value=\"checkbox1\"\/>checkbox1\n<input name=\"checkbox\" type=\"checkbox\" value=\"checkbox2\"\/>checkbox2\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<script type=\"text\/javascript\" src=\"..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\/**\nHTML\u4ee3\u7801\/\u6587\u672c\/\u503c\nhtml([val|fn]) a.html()\u53d6\u51faa\u7684html\u503c a.html(val) \u8ba9a\u7684html\u503c\u53d8\u4e3aval\ntext([val|fn]) \t a.text()\u53d6\u51faa\u7684text\u503c a.text(val) \u8ba9a\u7684\u6587\u672c\u503c\u53d8\u4e3aval\nval([val|fn|arr]) a.val() \u53d6\u51faa\u7684val\u503c\uff08input\uff09 a.val(v) \u8bbe\u7f6ea\u7684value\u503c\u4e3av \n\n\u5c5e\u6027\nattr(name|pro|key,val|fn) \n 1\u3001a.attr('name')\u53d6\u51faa\u7684name\u503c 2\u3001a.attr(\"name\",\"username\")\u628aa\u7684name\u503c\u8bbe\u7f6e\u4e3ausername\n \nremoveAttr(name) \na.removeAttr('class') \u79fb\u9664a\u7684class\u5c5e\u6027\n\n\nprop(name|pro|key,val|fn)1.6+ \n1\u3001a.prop('id') \u53d6\u51faa\u7684id\u503c 2\u3001a.prop('id',\"bj\") \u8bbe\u7f6ea\u7684id\u503c\u4e3abj\nremoveProp(name)1.6+\na.removeProp('class') \u79fb\u9664a\u7684class\u5c5e\u6027\n\n\n \n *\/\n\n<\/script>\n<script type=\"text\/javascript\">\n$(function(){\n\t$(\"#btn1\").click(function(){\n\t\n\t})\n})\n<\/script>\n\n<\/head>\n<body>\n<button id=\"btn1\">\u83b7\u53d6\u6587\u672c\u6846\u7684name\u503c<\/button>\n<form action=\"#\" id=\"form1\">\n\t\u6587\u672c\u6846:<input name=\"a\" value=\"abc\" type=\"text\"\/><br\/>\n\t\u591a\u9009\u6846:<input type=\"checkbox\" name=\"interest\" value=\"\u7bee\u7403\">\n\t<input type=\"checkbox\" name=\"interest\" value=\"zuqiu\">\n\t<input type=\"checkbox\" name=\"interest\" value=\"\u4e52\u4e53\">\n\t<input type=\"checkbox\" name=\"interest\" value=\"\u5fa1\u9a6c\">\n<\/form>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-\u7ec3\u4e60\uff1a\u5168\u9009\u3001\u5168\u4e0d\u9009\u3001\u53cd\u9009<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\n\t$(function(){\n\t\t\/\/ \u7ed9\u5168\u9009\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"#checkedAllBtn\").click(function () {\n\t\t\t$(\":checkbox\").prop(\"checked\",true);\n\n\t\t});\n\t\t\/\/ \u7ed9\u5168\u4e0d\u9009\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"#checkedNoBtn\").click(function () {\n\t\t\t$(\":checkbox\").prop(\"checked\",false);\n\n\t\t});\n\t\t\/\/ \u53cd\u9009\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"#checkedRevBtn\").click(function () {\n\t\t\t\/\/ \u67e5\u8be2\u5168\u90e8\u7684\u7403\u7c7b\u7684\u590d\u9009\u6846\n\t\t\t$(\":checkbox[name='items']\").each(function () {\n\t\t\t\t\/\/ \u5728each\u904d\u5386\u7684function\u51fd\u6570\u4e2d\uff0c\u6709\u4e00\u4e2athis\u5bf9\u8c61\u3002\u8fd9\u4e2athis\u5bf9\u8c61\u662f\u5f53\u524d\u6b63\u5728\u904d\u5386\u5230\u7684dom\u5bf9\u8c61\n\t\t\t\t\/\/ alert(this)\n\t\t\t\tthis.checked = !this.checked;\n\t\t\t})\n\n\t\t\t\/\/ \u8981\u68c0\u67e5\u662f\u5426\u6ee1\u9009\n\t\t\t\/\/ \u83b7\u53d6\u5168\u90e8\u7684\u7403\u7c7b\u4e2a\u6570\n\t\t\tvar allCount = $(\":checkbox[name='items']\").length;\n\t\t\t\/\/ \u518d\u83b7\u53d6\u9009\u4e2d\u7684\u7403\u7c7b\u4e2a\u6570\n\t\t\tvar checkedCount = $(\":checkbox[name='items']:checked\").length;\n\n\t\t\t\/\/ if (allCount == checkedCount) {\n\t\t\t\/\/ \t$(\"#checkedAllBox\").prop(\"checked\",true);\n\t\t\t\/\/ } else {\n\t\t\t\/\/ \t$(\"#checkedAllBox\").prop(\"checked\",false);\n\t\t\t\/\/ }\n\n\t\t\t$(\"#checkedAllBox\").prop(\"checked\",allCount == checkedCount);\n\n\t\t});\n\n\t\t\/\/ \u3010\u63d0\u4ea4\u3011\u6309\u952e\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"#sendBtn\").click(function () {\n\t\t\t\/\/ \u83b7\u53d6\u9009\u4e2d\u7684\u7403\u7c7b\u7684\u590d\u9009\u6846\n\t\t\t$(\":checkbox[name='items']:checked\").each(function () {\n\t\t\t\talert(this.value)\n\t\t\t\t\n\t\t\t})\n\n\t\t})\n\n\t\t\/\/ \u7ed9\u3010\u5168\u9009\/\u5168\u4e0d\u9009\u3011\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"#checkedAllBox\").click(function () {\n\n\t\t\t\/\/ \u5728\u4e8b\u4ef6\u7684function\u51fd\u6570\u4e2d\uff0c\u6709\u4e00\u4e2athis\u5bf9\u8c61\uff0c\u8fd9\u4e2athis\u5bf9\u8c61\u662f\u5f53\u524d\u6b63\u5728\u54cd\u5e94\u4e8b\u4ef6\u7684dom\u5bf9\u8c61\n\t\t\talert(this.checked);\n\n\t\t\t$(\":checkbox[name='items']\").prop(\"checked\",this.checked);\n\n\t\t})\n\n\t\t\/\/ \u7ed9\u5168\u90e8\u7403\u7c7b\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\":checkbox[name='items']\").click(function () {\n\t\t\t\/\/ \u8981\u68c0\u67e5\u662f\u5426\u6ee1\u9009\n\t\t\t\/\/ \u83b7\u53d6\u5168\u90e8\u7684\u7403\u7c7b\u4e2a\u6570\n\t\t\tvar allCount = $(\":checkbox[name='items']\").length;\n\t\t\t\/\/ \u518d\u83b7\u53d6\u9009\u4e2d\u7684\u7403\u7c7b\u4e2a\u6570\n\t\t\tvar checkedCount = $(\":checkbox[name='items']:checked\").length;\n\n\t\t\t$(\"#checkedAllBox\").prop(\"checked\",allCount == checkedCount);\n\t\t\t\n\t\t})\n\n\n\t});\n\t\n<\/script>\n<\/head>\n<body>\n\n\t<form method=\"post\" action=\"\">\n\t\n\t\t\u4f60\u7231\u597d\u7684\u8fd0\u52a8\u662f\uff1f<input type=\"checkbox\" id=\"checkedAllBox\" \/>\u5168\u9009\/\u5168\u4e0d\u9009 \n\t\t\n\t\t<br \/>\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u8db3\u7403\" \/>\u8db3\u7403\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u7bee\u7403\" \/>\u7bee\u7403\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u7fbd\u6bdb\u7403\" \/>\u7fbd\u6bdb\u7403\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u4e52\u4e53\u7403\" \/>\u4e52\u4e53\u7403\n\t\t<br \/>\n\t\t<input type=\"button\" id=\"checkedAllBtn\" value=\"\u5168\u3000\u9009\" \/>\n\t\t<input type=\"button\" id=\"checkedNoBtn\" value=\"\u5168\u4e0d\u9009\" \/>\n\t\t<input type=\"button\" id=\"checkedRevBtn\" value=\"\u53cd\u3000\u9009\" \/>\n\t\t<input type=\"button\" id=\"sendBtn\" value=\"\u63d0\u3000\u4ea4\" \/>\n\t<\/form>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\n\t$(function(){\n\t\t\n\t\tvar $items = $(\":checkbox[name=items]\");\n\t\tvar items = $(\"[name='items']\");\n\t\t\/\/\u5168\u9009\u6309\u94ae\n\t\t$(\"#checkedAllBtn\").click(function(){\n\t\t\titems.attr(\"checked\",true);\n\t\t\t$(\"#checkedAllBox\").attr(\"checked\",true);\n\t\t});\n\t\t\/\/\u5168\u4e0d\u9009\u6309\u94ae\n\t\t$(\"#checkedNoBtn\").click(function(){\n\t\t\titems.attr(\"checked\",false);\n\t\t\t$(\"#checkedAllBox\").attr(\"checked\",false);\n\t\t});\n\t\t\n\t\t\/\/\u53cd\u9009\u6309\u94ae\n\t\t$(\"#checkedRevBtn\").click(function(){\n\t\t\titems.each(function(){\n\t\t\t\tthis.checked = !this.checked;\n\t\t\t});\n\t\t\tvar flag = $(\"[name='items']:checked\").length==4;\n\t\t\t$(\"#checkedAllBox\").attr(\"checked\",flag);\n\t\t});\n\t\t\n\t\t\/\/\u63d0\u4ea4\u6309\u94ae\n\t\t$(\"#sendBtn\").click(function(){\n\t\t\t$(\":checkbox[name='items']:checked\").each(function(){\n\t\t\t\talert(this.value);\n\t\t\t});\n\t\t});\n\t\t\n\t\t\/\/\u5168\u9009\/\u5168\u4e0d\u9009\u590d\u9009\u6846\n\t\t$(\"#checkedAllBox\").click(function(){\n\t\t\titems.attr(\"checked\",this.checked);\n\t\t});\n\t\t\n\t\t\/\/\u5168\u9009\/\u5168\u4e0d\u9009\u590d\u9009\u6846\u4e0eitems\u72b6\u6001\u540c\u6b65\n\t\t$(\"[name='items']\").click(function(){\n\t\t\tvar flag = $(\"[name='items']:checked\").length==4;\n\t\t\t$(\"#checkedAllBox\").attr(\"checked\",flag);\n\t\t});\n\t});\n\t\n<\/script>\n<\/head>\n<body>\n\n\t<form method=\"post\" action=\"\">\n\t\n\t\t\u4f60\u7231\u597d\u7684\u8fd0\u52a8\u662f\uff1f<input type=\"checkbox\" id=\"checkedAllBox\" \/>\u5168\u9009\/\u5168\u4e0d\u9009 \n\t\t\n\t\t<br \/>\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u8db3\u7403\" \/>\u8db3\u7403\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u7bee\u7403\" \/>\u7bee\u7403\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u7fbd\u6bdb\u7403\" \/>\u7fbd\u6bdb\u7403\n\t\t<input type=\"checkbox\" name=\"items\" value=\"\u4e52\u4e53\u7403\" \/>\u4e52\u4e53\u7403\n\t\t<br \/>\n\t\t<input type=\"button\" id=\"checkedAllBtn\" value=\"\u5168\u3000\u9009\" \/>\n\t\t<input type=\"button\" id=\"checkedNoBtn\" value=\"\u5168\u4e0d\u9009\" \/>\n\t\t<input type=\"button\" id=\"checkedRevBtn\" value=\"\u53cd\u3000\u9009\" \/>\n\t\t<input type=\"button\" id=\"sendBtn\" value=\"\u63d0\u3000\u4ea4\" \/>\n\t<\/form>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-dom\u7684\u589e\uff0c\u5220\uff0c\u6539<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n\t<meta charset=\"UTF-8\">\n\t<title>Title<\/title>\n\t<script type=\"text\/javascript\" src=\"..\/script\/jquery-1.7.2.js\"><\/script>\n\t<script type=\"text\/javascript\">\n\t\t\/*\n\t\t\u5185\u90e8\u63d2\u5165\uff1a\n\t\tappendTo()\t\ta.appendTo(b)\t\t\u628a a \u63d2\u5165\u5230 b \u5b50\u5143\u7d20\u672b\u5c3e\uff0c\u6210\u4e3a\u6700\u540e\u4e00\u4e2a\u5b50\u5143\u7d20\n\t\tprependTo()\t\ta.prependTo(b)\t\t\u628a a \u63d2\u5230 b \u6240\u6709\u5b50\u5143\u7d20\u524d\u9762\uff0c\u6210\u4e3a\u7b2c\u4e00\u4e2a\u5b50\u5143\u7d20\n\n\t\t\u5916\u90e8\u63d2\u5165\uff1a\n\t\tinsertAfter()\ta.insertAfter(b)\t\u5f97\u5230 ba\n\t\tinsertBefore()\ta.insertBefore(b)\t\u5f97\u5230 ab\n\n\t\t\u66ff\u6362:\n\t\treplaceWith()\ta.replaceWith(b) \t\u7528 b \u66ff\u6362\u6389 a\n\t\treplaceAll()\ta.replaceAll(b)\t\t\u7528 a \u66ff\u6362\u6389\u6240\u6709 b\n\n\t\t\u5220\u9664\uff1a\n\t\tremove()\t\ta.remove();\t\t\t\u5220\u9664 a \u6807\u7b7e\n\t\tempty()\t\t\ta.empty();\t\t\t\u6e05\u7a7a a \u6807\u7b7e\u91cc\u7684\u5185\u5bb9\n\t\t *\/\n\n\t\t$(function () {\n\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").appendTo(\"div\");\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").prependTo(\"div\");\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").prependTo($(\"div\"));\n\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").insertAfter(\"div\");\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").insertBefore(\"div\");\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").insertBefore($(\"div\"));\n\n\t\t\t\/\/ $(\"div\").replaceWith($(\"<h1>\u6807\u9898<\/h1>\"));\n\t\t\t\/\/ $(\"<h1>\u6807\u9898<\/h1>\").replaceAll(\"div\");\n\n\t\t\t\/\/ $(\"div\").remove()\n\t\t\t$(\"div\").empty()\n\t\t})\n\n\t<\/script>\n<\/head>\n<body>\n\t<div>1234<\/div>\n\t<div>1234<\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>DOM\u589e\u5220\u6539<\/title>\n\t\t<link rel=\"stylesheet\" type=\"text\/css\" href=\"style\/css.css\" \/>\n\t\t<script type=\"text\/javascript\" src=\"..\/script\/jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\/**\n\u6587\u6863\u5904\u7406\n\u5185\u90e8\u63d2\u5165\n\nappendTo(content) \t a.appendTo(b); \u628aa\u52a0\u5230b\u91cc\u9762\t\t\t\t \u6dfb\u52a0\u5230\u6700\u540e\u9762\nprependTo(content)\t a.prependTo(b); \u628aa\u6dfb\u52a0\u5230b\u91cc\u9762 \t\t\t \u6dfb\u52a0\u5230\u6700\u524d\u9762\n\n\u5916\u90e8\u63d2\u5165\ninsertAfter(content) \ta.insertAfter(b); \u628aa\u63d2\u5165\u5230b\u7684\u540e\u9762\ninsertBefore(content) \ta.insertBefore(b); \u628aa\u63d2\u5165\u5230b\u7684\u524d\u9762\n\n\n\u66ff\u6362\nreplaceWith(content|fn) a.replaceWith(b) \u628aa\u7528b\u66ff\u6362\nreplaceAll(selector) \ta.replaceAll(b)\t \u7528a\u66ff\u6362\u6240\u6709\u7684b\n\n\u5220\u9664\nempty() \t\t\t\ta.empty() \u628aa\u638f\u7a7a\uff0c\u628aa\u91cc\u9762\u7684\u6240\u6709\u5143\u7d20\u90fd\u5220\u9664\nremove([expr]) \t\t\ta.remove(b) \u6240\u6709\u7684a\uff0c\u662fb\u7684\u8bdd\u5c31\u4f1a\u5220\u9664\ta.remove()\u5220\u9664a\t\t\n\n\n\n*\/\n\t\t\t$(function(){\n\t\t\t\n\t\t\t\t\n\t\t\t\t$(\"#btn01\").click(function(){\n\t\t\t\t\t\/\/\u521b\u5efa\u4e00\u4e2a\"\u5e7f\u5dde\"\u8282\u70b9,\u6dfb\u52a0\u5230#city\u4e0b[appendTo()]\n\t\t\t\t\t\/\/\u5b50\u8282\u70b9.appendTo(\u7236\u8282\u70b9)\n\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t$(\"#btn02\").click(function(){\n\t\t\t\t\t\/\/\u521b\u5efa\u4e00\u4e2a\"\u5e7f\u5dde\"\u8282\u70b9,\u6dfb\u52a0\u5230#city\u4e0b[prependTo()]\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t$(\"#btn03\").click(function(){\n\t\t\t\t\t\/\/\u5c06\"\u5e7f\u5dde\"\u8282\u70b9\u63d2\u5165\u5230#bj\u524d\u9762[insertBefore()]\n\t\t\t\t\t\/\/\u524d\u8fb9.insertBefore(\u540e\u8fb9\u7684)\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t$(\"#btn04\").click(function(){\n\t\t\t\t\t\/\/\u5c06\"\u5e7f\u5dde\"\u8282\u70b9\u63d2\u5165\u5230#bj\u540e\u9762[insertAfter()]\n\t\t\t\t\t\/\/\u540e\u8fb9.insertAfter(\u524d\u8fb9\u7684)\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#btn05\").click(function(){\n\t\t\t\t\t\/\/\u4f7f\u7528\"\u5e7f\u5dde\"\u8282\u70b9\u66ff\u6362#bj\u8282\u70b9[replaceWith()]\n\t\t\t\t\t\/\/\u88ab\u66ff\u6362\u7684.replaceWith()\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#btn06\").click(function(){\n\t\t\t\t\t\/\/\u4f7f\u7528\"\u5e7f\u5dde\"\u8282\u70b9\u66ff\u6362#bj\u8282\u70b9[replaceAll()]\n\t\t\t\t\t\/\/\u65b0\u7684\u8282\u70b9.replaceAll(\u65e7\u7684\u8282\u70b9)\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#btn07\").click(function(){\n\t\t\t\t\t\/\/\u5220\u9664#rl\u8282\u70b9[remove()]\n\t\t\t\t\t\/\/$(\"ul\").remove(\"#rl\");\n\t\t\t\t\t\/\/$(\"#rl\").remove();\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#btn08\").click(function(){\n\t\t\t\t\t\/\/\u638f\u7a7a#city\u8282\u70b9[empty()]\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#btn09\").click(function(){\n\t\t\t\t\t\/\/\u8bfb\u53d6#city\u5185\u7684HTML\u4ee3\u7801\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#btn10\").click(function(){\n\t\t\t\t\t\/\/\u8bbe\u7f6e#bj\u5185\u7684HTML\u4ee3\u7801\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t});\n\t\t\t\n\t\t\n\t\t<\/script>\n\t\t\n\t<\/head>\n\t<body>\n\t\t<div id=\"total\">\n\t\t\t<div class=\"inner\">\n\t\t\t\t<p>\n\t\t\t\t\t\u4f60\u559c\u6b22\u54ea\u4e2a\u57ce\u5e02?\n\t\t\t\t<\/p>\n\n\t\t\t\t<ul id=\"city\">\n\t\t\t\t\t<li id=\"bj\">\u5317\u4eac<\/li>\n\t\t\t\t\t<li>\u4e0a\u6d77<\/li>\n\t\t\t\t\t<li>\u4e1c\u4eac<\/li>\n\t\t\t\t\t<li>\u9996\u5c14<\/li>\n\t\t\t\t<\/ul>\n\n\t\t\t\t<br>\n\t\t\t\t<br>\n\n\t\t\t\t<p>\n\t\t\t\t\t\u4f60\u559c\u6b22\u54ea\u6b3e\u5355\u673a\u6e38\u620f?\n\t\t\t\t<\/p>\n\n\t\t\t\t<ul id=\"game\">\n\t\t\t\t\t<li id=\"rl\">\u7ea2\u8b66<\/li>\n\t\t\t\t\t<li>\u5b9e\u51b5<\/li>\n\t\t\t\t\t<li>\u6781\u54c1\u98de\u8f66<\/li>\n\t\t\t\t\t<li>\u9b54\u517d<\/li>\n\t\t\t\t<\/ul>\n\n\t\t\t\t<br \/>\n\t\t\t\t<br \/>\n\n\t\t\t\t<p>\n\t\t\t\t\t\u4f60\u624b\u673a\u7684\u64cd\u4f5c\u7cfb\u7edf\u662f?\n\t\t\t\t<\/p>\n\n\t\t\t\t<ul id=\"phone\"><li>IOS<\/li><li id=\"android\">Android<\/li><li>Windows Phone<\/li><\/ul>\n\t\t\t<\/div>\n\n\t\t\t<div class=\"inner\">\n\t\t\t\tgender:\n\t\t\t\t<input type=\"radio\" name=\"gender\" value=\"male\"\/>\n\t\t\t\tMale\n\t\t\t\t<input type=\"radio\" name=\"gender\" value=\"female\"\/>\n\t\t\t\tFemale\n\t\t\t\t<br>\n\t\t\t\t<br>\n\t\t\t\tname:\n\t\t\t\t<input type=\"text\" name=\"name\" id=\"username\" value=\"abcde\"\/>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<div id=\"btnList\">\n\t\t\t<div><button id=\"btn01\">\u521b\u5efa\u4e00\u4e2a\"\u5e7f\u5dde\"\u8282\u70b9,\u6dfb\u52a0\u5230#city\u4e0b[appendTo()]<\/button><\/div>\n\t\t\t<div><button id=\"btn02\">\u521b\u5efa\u4e00\u4e2a\"\u5e7f\u5dde\"\u8282\u70b9,\u6dfb\u52a0\u5230#city\u4e0b[prependTo()]<\/button><\/div>\n\t\t\t<div><button id=\"btn03\">\u5c06\"\u5e7f\u5dde\"\u8282\u70b9\u63d2\u5165\u5230#bj\u524d\u9762[insertBefore()]<\/button><\/div>\n\t\t\t<div><button id=\"btn04\">\u5c06\"\u5e7f\u5dde\"\u8282\u70b9\u63d2\u5165\u5230#bj\u540e\u9762[insertAfter()]<\/button><\/div>\n\t\t\t<div><button id=\"btn05\">\u4f7f\u7528\"\u5e7f\u5dde\"\u8282\u70b9\u66ff\u6362#bj\u8282\u70b9[replaceWith()]<\/button><\/div>\n\t\t\t<div><button id=\"btn06\">\u4f7f\u7528\"\u5e7f\u5dde\"\u8282\u70b9\u66ff\u6362#bj\u8282\u70b9[replaceAll()]<\/button><\/div>\n\t\t\t<div><button id=\"btn07\">\u5220\u9664#rl\u8282\u70b9[remove()]<\/button><\/div>\n\t\t\t<div><button id=\"btn08\">\u638f\u7a7a#city\u8282\u70b9[empty()]<\/button><\/div>\n\t\t\t<div><button id=\"btn09\">\u8bfb\u53d6#city\u5185\u7684HTML\u4ee3\u7801<\/button><\/div>\n\t\t\t<div><button id=\"btn10\">\u8bbe\u7f6e#bj\u5185\u7684HTML\u4ee3\u7801<\/button><\/div>\n\t\t\t\n\t\t<\/div>\n\t<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\njQuery-\u7ec3\u4e60\uff1a\u4ece\u5de6\u5230\u53f3\uff0c\u4ece\u53f3\u5230\u5de6<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n\t<style type=\"text\/css\">\n\t\tselect {\n\t\t\twidth: 100px;\n\t\t\theight: 140px;\n\t\t}\n\t\t\n\t\tdiv {\n\t\t\twidth: 130px;\n\t\t\tfloat: left;\n\t\t\ttext-align: center;\n\t\t}\n\t<\/style>\n\t<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n\t<script type=\"text\/javascript\">\n\t\t\/\/ \u9875\u9762\u52a0\u8f7d\u5b8c\u6210\n\t\t$(function () {\n\t\t\t\/\/ \u7b2c\u4e00\u4e2a\u6309\u94ae\t\u3010\u9009\u4e2d\u6dfb\u52a0\u5230\u53f3\u8fb9\u3011\n\t\t\t$(\"button:eq(0)\").click(function () {\n\t\t\t\t$(\"select:eq(0) option:selected\").appendTo($(\"select:eq(1)\"));\n\n\t\t\t});\n\t\t\t\/\/ \u7b2c\u4e8c\u4e2a\u6309\u94ae\t\u3010\u5168\u90e8\u6dfb\u52a0\u5230\u53f3\u8fb9\u3011\n\t\t\t$(\"button:eq(1)\").click(function () {\n\t\t\t\t$(\"select:eq(0) option\").appendTo($(\"select:eq(1)\"));\n\n\t\t\t});\n\n\t\t\t\/\/ \u7b2c\u4e09\u4e2a\u6309\u94ae\t\u3010\u9009\u4e2d\u5220\u9664\u5230\u505a\u8fb9\u3011\n\t\t\t$(\"button:eq(2)\").click(function () {\n\t\t\t\t$(\"select:eq(1) option:selected\").appendTo($(\"select:eq(0)\"));\n\n\t\t\t});\n\n\t\t\t\/\/ \u7b2c\u56db\u4e2a\u6309\u94ae\t\u3010\u5168\u90e8\u5220\u9664\u5230\u505a\u8fb9\u3011\n\t\t\t$(\"button:eq(3)\").click(function () {\n\t\t\t\t$(\"select:eq(1) option\").appendTo($(\"select:eq(0)\"));\n\n\t\t\t});\n\n\n\n\t\t})\n\t\t\n\t\t\n\t\n\t<\/script>\n<\/head>\n<body>\n\n\t<div id=\"left\">\n\t\t<select multiple=\"multiple\" name=\"sel01\">\n\t\t\t<option value=\"opt01\">\u9009\u98791<\/option>\n\t\t\t<option value=\"opt02\">\u9009\u98792<\/option>\n\t\t\t<option value=\"opt03\">\u9009\u98793<\/option>\n\t\t\t<option value=\"opt04\">\u9009\u98794<\/option>\n\t\t\t<option value=\"opt05\">\u9009\u98795<\/option>\n\t\t\t<option value=\"opt06\">\u9009\u98796<\/option>\n\t\t\t<option value=\"opt07\">\u9009\u98797<\/option>\n\t\t\t<option value=\"opt08\">\u9009\u98798<\/option>\n\t\t<\/select>\n\t\t\n\t\t<button>\u9009\u4e2d\u6dfb\u52a0\u5230\u53f3\u8fb9<\/button>\n\t\t<button>\u5168\u90e8\u6dfb\u52a0\u5230\u53f3\u8fb9<\/button>\n\t<\/div>\n\t<div id=\"rigth\">\n\t\t<select multiple=\"multiple\" name=\"sel02\">\n\t\t<\/select>\n\t\t<button>\u9009\u4e2d\u5220\u9664\u5230\u5de6\u8fb9<\/button>\n\t\t<button>\u5168\u90e8\u5220\u9664\u5230\u5de6\u8fb9<\/button>\n\t<\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n\t<style type=\"text\/css\">\n\t\tselect {\n\t\t\twidth: 100px;\n\t\t\theight: 140px;\n\t\t}\n\t\t\n\t\tdiv {\n\t\t\twidth: 130px;\n\t\t\tfloat: left;\n\t\t\ttext-align: center;\n\t\t}\n\t<\/style>\n\t<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n\t<script type=\"text\/javascript\">\t\n\t\t$(function(){\n\t\t\t\/\/\u9009\u4e2d\u6dfb\u52a0\u5230\u53f3\u8fb9\n\t\t\t$(\"button:eq(0)\").click(function(){\n\t\t\t\t$(\"select[name=sel01] :selected\").each(function(){\n\t\t\t\t\t\/\/alert(this);\n\t\t\t\t\t$(this).appendTo(\"select[name=sel02]\");\n\t\t\t\t});\n\t\t\t});\n\t\t\t\n\t\t\t\/\/\u5168\u90e8\u6dfb\u52a0\u5230\u53f3\u8fb9\n\t\t\t$(\"button:eq(1)\").click(function(){\n\t\t\t\t$(\"select[name=sel01] option\").each(function(){\n\t\t\t\t\t\/\/alert(this);\n\t\t\t\t\t$(this).appendTo(\"select[name=sel02]\");\n\t\t\t\t});\n\t\t\t});\n\t\t\t\n\t\t\t\/\/\u9009\u4e2d\u5220\u9664\u5230\u5de6\u8fb9\n\t\t\t$(\"button:eq(2)\").click(function(){\n\t\t\t\t$(\"select[name=sel02] :selected\").each(function(){\n\t\t\t\t\t\/\/alert(this);\n\t\t\t\t\t$(this).appendTo(\"select[name=sel01]\");\n\t\t\t\t});\n\t\t\t});\n\t\t\t\/\/\u5168\u90e8\u5220\u9664\u5230\u5de6\u8fb9\n\t\t\t$(\"button:eq(3)\").click(function(){\n\t\t\t\t$(\"select[name=sel02] option\").each(function(){\n\t\t\t\t\t\/\/alert(this);\n\t\t\t\t\t$(this).appendTo(\"select[name=sel01]\");\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t\n\t<\/script>\n<\/head>\n<body>\n\n\t<div id=\"left\">\n\t\t<select multiple=\"multiple\" name=\"sel01\">\n\t\t\t<option value=\"opt01\">\u9009\u98791<\/option>\n\t\t\t<option value=\"opt02\">\u9009\u98792<\/option>\n\t\t\t<option value=\"opt03\">\u9009\u98793<\/option>\n\t\t\t<option value=\"opt04\">\u9009\u98794<\/option>\n\t\t\t<option value=\"opt05\">\u9009\u98795<\/option>\n\t\t\t<option value=\"opt06\">\u9009\u98796<\/option>\n\t\t\t<option value=\"opt07\">\u9009\u98797<\/option>\n\t\t\t<option value=\"opt08\">\u9009\u98798<\/option>\n\t\t<\/select>\n\t\t\n\t\t<button>\u9009\u4e2d\u6dfb\u52a0\u5230\u53f3\u8fb9<\/button>\n\t\t<button>\u5168\u90e8\u6dfb\u52a0\u5230\u53f3\u8fb9<\/button>\n\t<\/div>\n\t<div id=\"rigth\">\n\t\t<select multiple=\"multiple\" name=\"sel02\">\n\t\t<\/select>\n\t\t<button>\u9009\u4e2d\u5220\u9664\u5230\u5de6\u8fb9<\/button>\n\t\t<button>\u5168\u90e8\u5220\u9664\u5230\u5de6\u8fb9<\/button>\n\t<\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-\u7ec3\u4e60\uff1a\u52a8\u6001\u6dfb\u52a0\u548c\u5220\u9664\u884c\u8bb0\u5f55<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Untitled Document<\/title>\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"styleB\/css.css\" \/>\n<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\n\t$(function () {\n\n\n\t\t\/\/ \u521b\u5efa\u4e00\u4e2a\u7528\u4e8e\u590d\u7528\u7684\u5220\u9664\u7684function\u51fd\u6570\n\t\tvar deleteFun = function () {\n\n\t\t\t\/\/ alert(\"\u5220\u9664 \u64cd\u4f5c \u7684function : \" + this)\n\n\t\t\t\/\/ \u5728\u4e8b\u4ef6\u54cd\u5e94\u7684function\u51fd\u6570\u4e2d\u3002\u6709\u4e00\u4e2athis\u5bf9\u8c61\uff0c\u8fd9\u4e2athis\u5bf9\u8c61\u662f\u5f53\u524d\u6b63\u5728\u54cd\u5e94\u4e8b\u4ef6\u7684dom\u5bf9\u8c61\n\t\t\tvar $trObj = $(this).parent().parent();\n\n\t\t\tvar name = $trObj.find(\"td:first\").text();\n\n\t\t\t\/*\n\t\t\tconfirm \u662fJavaScript\u8bed\u8a00\u63d0\u4f9b\u7684\u4e00\u4e2a\u786e\u8ba4\u63d0\u793a\u6846\u51fd\u6570\u3002\u4f60\u7ed9\u5b83\u4f20\u4ec0\u4e48\uff0c\u5b83\u5c31\u63d0\u793a\u4ec0\u4e48\n\t\t\t\u5f53\u7528\u6237\u70b9\u51fb\u4e86\u786e\u5b9a\uff0c\u5c31\u8fd4\u56detrue\u3002\u5f53\u7528\u6237\u70b9\u51fb\u4e86\u53d6\u6d88\uff0c\u5c31\u8fd4\u56defalse\n\t\t\t *\/\n\t\t\tif (confirm(\"\u4f60\u786e\u5b9a\u8981\u5220\u9664[\" + name + \"]\u5417\uff1f\")) {\n\t\t\t\t$trObj.remove();\n\t\t\t}\n\n\t\t\t\/\/ return false; \u53ef\u4ee5\u963b\u6b62 \u5143\u7d20\u7684\u9ed8\u8ba4\u884c\u4e3a\u3002\n\t\t\treturn false;\n\n\t\t}\n\t\t\/\/ \u7ed9\u3010Submit\u3011\u6309\u94ae\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"#addEmpButton\").click(function () {\n\n\t\t\t\/\/ \u83b7\u53d6\u8f93\u5165\u6846\uff0c\u59d3\u540d\uff0c\u90ae\u7bb1\uff0c\u5de5\u8d44\u7684\u5185\u5bb9\n\t\t\tvar name = $(\"#empName\").val();\n\t\t\tvar email = $(\"#email\").val();\n\t\t\tvar salary = $(\"#salary\").val();\n\n\t\t\t\/\/ \u521b\u5efa\u4e00\u4e2a\u884c\u6807\u7b7e\u5bf9\u8c61\uff0c\u6dfb\u52a0\u5230\u663e\u793a\u6570\u636e\u7684\u8868\u683c\u4e2d\n\t\t\tvar $trObj = $(\"<tr>\" +\n\t\t\t\t\t\"<td>\" + name + \"<\/td>\" +\n\t\t\t\t\t\"<td>\" + email + \"<\/td>\" +\n\t\t\t\t\t\"<td>\" + salary + \"<\/td>\" +\n\t\t\t\t\t\"<td><a href=\\\"#\\\">Delete<\/a><\/td>\" +\n\t\t\t\t\t\"<\/tr>\");\n\n\t\t\t\/\/ \u6dfb\u52a0\u5230\u663e\u793a\u6570\u636e\u7684\u8868\u683c\u4e2d\n\t\t\t$trObj.appendTo($(\"#employeeTable\"));\n\n\t\t\t\/\/ \u7ed9\u6dfb\u52a0\u7684\u884c\u7684a\u6807\u7b7e\u7ed1\u4e0a\u4e8b\u4ef6\n\t\t\t$trObj.find(\"a\").click(deleteFun);\n\n\t\t});\n\n\t\t\/\/ alert($(\"a\").length);\n\t\t\n\t\t\/\/ \u7ed9\u5220\u9664\u7684a\u6807\u7b7e\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\n\t\t$(\"a\").click(deleteFun);\n\n\t})\n\t\n\t\n<\/script>\n<\/head>\n<body>\n\n\t<table id=\"employeeTable\">\n\t\t<tr>\n\t\t\t<th>Name<\/th>\n\t\t\t<th>Email<\/th>\n\t\t\t<th>Salary<\/th>\n\t\t\t<th> <\/th>\n\t\t<\/tr>\n\t\t<tr>\n\t\t\t<td>Tom<\/td>\n\t\t\t<td>tom@tom.com<\/td>\n\t\t\t<td>5000<\/td>\n\t\t\t<td><a href=\"deleteEmp?id=001\">Delete<\/a><\/td>\n\t\t<\/tr>\n\t\t<tr>\n\t\t\t<td>Jerry<\/td>\n\t\t\t<td>jerry@sohu.com<\/td>\n\t\t\t<td>8000<\/td>\n\t\t\t<td><a href=\"deleteEmp?id=002\">Delete<\/a><\/td>\n\t\t<\/tr>\n\t\t<tr>\n\t\t\t<td>Bob<\/td>\n\t\t\t<td>bob@tom.com<\/td>\n\t\t\t<td>10000<\/td>\n\t\t\t<td><a href=\"deleteEmp?id=003\">Delete<\/a><\/td>\n\t\t<\/tr>\n\t<\/table>\n\n\t<div id=\"formDiv\">\n\t\n\t\t<h4>\u6dfb\u52a0\u65b0\u5458\u5de5<\/h4>\n\n\t\t<table>\n\t\t\t<tr>\n\t\t\t\t<td class=\"word\">name: <\/td>\n\t\t\t\t<td class=\"inp\">\n\t\t\t\t\t<input type=\"text\" name=\"empName\" id=\"empName\" \/>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td class=\"word\">email: <\/td>\n\t\t\t\t<td class=\"inp\">\n\t\t\t\t\t<input type=\"text\" name=\"email\" id=\"email\" \/>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td class=\"word\">salary: <\/td>\n\t\t\t\t<td class=\"inp\">\n\t\t\t\t\t<input type=\"text\" name=\"salary\" id=\"salary\" \/>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td colspan=\"2\" align=\"center\">\n\t\t\t\t\t<button id=\"addEmpButton\" value=\"abc\">\n\t\t\t\t\t\tSubmit\n\t\t\t\t\t<\/button>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/table>\n\n\t<\/div>\n\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Untitled Document<\/title>\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"styleB\/css.css\" \/>\n<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\n\t$(function(){\n\t\t\n\t\t\/\/\u5220\u9664\u7528\u6237\u7684\u65b9\u6cd5\n\t\tfunction delA(){\n\t\t\t\/\/\u83b7\u53d6\u8981\u5220\u9664\u5458\u5de5\u7684\u540d\u5b57\n\t\t\tvar name = $(this).parents(\"tr\").find(\"td:eq(0)\").text();\n\t\t\t\/\/\u5f39\u51fa\u4e00\u4e2a\u786e\u8ba4\u6846\n\t\t\tvar flag = confirm(\"\u786e\u8ba4\u5220\u9664\"+name+\"\u5417\uff1f\");\n\t\t\tif(flag){\n\t\t\t\t\/\/\u5220\u9664\u5f53\u524da\u6240\u5728\u7684tr\n\t\t\t\t$(this).parents(\"tr\").remove();\n\t\t\t}\n\t\t\t\/\/\u53d6\u6d88\u9ed8\u8ba4\u884c\u4e3a\n\t\t\treturn false;\n\t\t}\n\t\t\n\t\t\/\/\u5220\u9664\u7528\u6237\n\t\t\/\/$(\"a\").click(delA);\n\t\t$(\"a\").live(\"click\" , delA);\n\t\t\n\t\t\/\/\u6dfb\u52a0\u5458\u5de5\n\t\t$(\"#addEmpButton\").click(function(){\n\t\t\t\/\/\u83b7\u53d6\u7528\u6237\u586b\u5199\u7684\u5185\u5bb9\n\t\t\tvar name = $(\"#empName\").val();\n\t\t\tvar email = $(\"#email\").val();\n\t\t\tvar salary = $(\"#salary\").val();\n\t\t\t\n\t\t\t\/\/\u521b\u5efatr\n\t\t\t\/*\n\t\t\t\t<tr>\n\t\t\t\t\t<td>Tom<\/td>\n\t\t\t\t\t<td>tom@tom.com<\/td>\n\t\t\t\t\t<td>5000<\/td>\n\t\t\t\t\t<td><a href=\"#\">Delete<\/a><\/td>\n\t\t\t\t<\/tr>\n\t\t\t*\/\n\t\t\t$(\"<tr><\/tr>\").append(\"<td>\"+name+\"<\/td>\")\n\t\t\t\t\t\t .append(\"<td>\"+email+\"<\/td>\")\n\t\t\t\t\t\t .append(\"<td>\"+salary+\"<\/td>\")\n\t\t\t\t\t\t .append(\"<td><a href='#'>Delete<\/a><\/td>\")\n\t\t\t\t\t\t .appendTo(\"#employeeTable\");\n\t\t\t\n\t\t});\n\t});\n\t\n\t\n<\/script>\n<\/head>\n<body>\n\n\t<table id=\"employeeTable\">\n\t\t<tr>\n\t\t\t<th>Name<\/th>\n\t\t\t<th>Email<\/th>\n\t\t\t<th>Salary<\/th>\n\t\t\t<th> <\/th>\n\t\t<\/tr>\n\t\t<tr>\n\t\t\t<td>Tom<\/td>\n\t\t\t<td>tom@tom.com<\/td>\n\t\t\t<td>5000<\/td>\n\t\t\t<td><a href=\"#\">Delete<\/a><\/td>\n\t\t<\/tr>\n\t\t<tr>\n\t\t\t<td>Jerry<\/td>\n\t\t\t<td>jerry@sohu.com<\/td>\n\t\t\t<td>8000<\/td>\n\t\t\t<td><a href=\"#\">Delete<\/a><\/td>\n\t\t<\/tr>\n\t\t<tr>\n\t\t\t<td>Bob<\/td>\n\t\t\t<td>bob@tom.com<\/td>\n\t\t\t<td>10000<\/td>\n\t\t\t<td><a href=\"#\">Delete<\/a><\/td>\n\t\t<\/tr>\n\t<\/table>\n\n\t<div id=\"formDiv\">\n\t\n\t\t<h4>\u6dfb\u52a0\u65b0\u5458\u5de5<\/h4>\n\n\t\t<table>\n\t\t\t<tr>\n\t\t\t\t<td class=\"word\">name: <\/td>\n\t\t\t\t<td class=\"inp\">\n\t\t\t\t\t<input type=\"text\" name=\"empName\" id=\"empName\" \/>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td class=\"word\">email: <\/td>\n\t\t\t\t<td class=\"inp\">\n\t\t\t\t\t<input type=\"text\" name=\"email\" id=\"email\" \/>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td class=\"word\">salary: <\/td>\n\t\t\t\t<td class=\"inp\">\n\t\t\t\t\t<input type=\"text\" name=\"salary\" id=\"salary\" \/>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td colspan=\"2\" align=\"center\">\n\t\t\t\t\t<button id=\"addEmpButton\" value=\"abc\">\n\t\t\t\t\t\tSubmit\n\t\t\t\t\t<\/button>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/table>\n\n\t<\/div>\n\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\njQuery-css\u6837\u5f0f\u64cd\u4f5c<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<style type=\"text\/css\">\n\t\n\tdiv{\n\t\twidth:100px;\n\t\theight:260px;\n\t}\n\t\n\tdiv.whiteborder{\n\t\tborder: 2px white solid;\n\t}\n\t\n\tdiv.redDiv{\n\t\tbackground-color: red;\n\t}\n\n\t\/*\u9650\u5b9a\u5f53\u524d\u6837\u5f0f\u53ea\u80fd\u7ed9div\u4f7f\u7528*\/\n\tdiv.blueBorder{\n\t\tborder: 5px blue solid;\n\t}\n\t\n<\/style>\n\n<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\/*\n\taddClass()\t\t\u6dfb\u52a0\u6837\u5f0f\n\tremoveClass()\t\u5220\u9664\u6837\u5f0f\n\ttoggleClass()\t\u6709\u5c31\u5220\u9664\uff0c\u6ca1\u6709\u5c31\u6dfb\u52a0\u6837\u5f0f\u3002\n\toffset()\t\t\u83b7\u53d6\u548c\u8bbe\u7f6e\u5143\u7d20\u7684\u5750\u6807\u3002\n\t *\/\n\n\t$(function(){\n\t\t\n\t\tvar $divEle = $('div:first');\n\t\t\n\t\t$('#btn01').click(function(){\n\t\t\t\/\/addClass() - \u5411\u88ab\u9009\u5143\u7d20\u6dfb\u52a0\u4e00\u4e2a\u6216\u591a\u4e2a\u7c7b\n\t\t\t$divEle.addClass('redDiv blueBorder')\n\t\t\t\n\t\t});\n\t\t\n\t\t$('#btn02').click(function(){\n\t\t\t\/\/removeClass() - \u4ece\u88ab\u9009\u5143\u7d20\u5220\u9664\u4e00\u4e2a\u6216\u591a\u4e2a\u7c7b\n\t\t\t$divEle.removeClass(\"redDiv blueBorder\")\n\t\t\t$divEle.removeClass()\/\/\u5168\u90e8\u5220\u9664\n\n\t\t});\n\t\n\t\t\n\t\t$('#btn03').click(function(){\n\t\t\t\/\/toggleClass() - \u5bf9\u88ab\u9009\u5143\u7d20\u8fdb\u884c\u6dfb\u52a0\/\u5220\u9664\u7c7b\u7684\u5207\u6362\u64cd\u4f5c\n\t\t\t$divEle.toggleClass('redDiv')\n\t\t\t\n\t\t});\n\t\t\n\t\t\n\t\t$('#btn04').click(function(){\n\t\t\t\/\/offset() - \u8fd4\u56de\u7b2c\u4e00\u4e2a\u5339\u914d\u5143\u7d20\u76f8\u5bf9\u4e8e\u6587\u6863\u7684\u4f4d\u7f6e\u3002\n\t\t\tvar pos = $divEle.offset();\n\t\t\tconsole.log(pos);\n\n\t\t\t$divEle.offset({\n\t\t\t\ttop:100,\n\t\t\t\tleft:50\n\t\t\t})\n\t\t\n\t\t});\n\t\t\n\t})\n<\/script>\n<\/head>\n<body>\n\n\t<table align=\"center\">\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<div class=\"border\">\n\t\t\t\t<\/div>\n\t\t\t<\/td>\n\t\t\t\n\t\t\t<td>\n\t\t\t\t<div class=\"btn\">\n\t\t\t\t\t<input type=\"button\" value=\"addClass()\" id=\"btn01\"\/>\n\t\t\t\t\t<input type=\"button\" value=\"removeClass()\" id=\"btn02\"\/>\n\t\t\t\t\t<input type=\"button\" value=\"toggleClass()\" id=\"btn03\"\/>\n\t\t\t\t\t<input type=\"button\" value=\"offset()\" id=\"btn04\"\/>\n\t\t\t\t<\/div>\n\t\t\t<\/td>\n\t\t<\/tr>\n\t<\/table>\n\t\n\t\n\t\n\t<br \/> <br \/>\n\t\n\t\n\t<br \/> <br \/>\n\t\n\t\n\t\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<style type=\"text\/css\">\n\t\n\tdiv{\n\t\twidth:100px;\n\t\theight:260px;\n\t}\n\t\n\tdiv.border{\n\t\tborder: 2px white solid;\n\t}\n\t\n\tdiv.redDiv{\n\t\tbackground-color: red;\n\t}\n\t\n\tdiv.blackDiv{\n\t\tborder: 5px blue solid;\n\t}\n\t\n\t\n\t\n\t\n<\/style>\n\n<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\n\n\t$(function(){\n\t\t\/*\nCSS\ncss(name|pro|[,val|fn]) \u8bfb\u5199\u5339\u914d\u5143\u7d20\u7684\u6837\u5f0f\u5c5e\u6027\u3002 \n\t\t\t\t\t\t\t\ta.css('color')\u53d6\u51faa\u5143\u7d20\u7684color\n\t\t\t\t\t\t\t\ta.css('color',\"red\")\u8bbe\u7f6ea\u5143\u7d20\u7684color\u4e3ared\n\nCSS \u7c7b\n\naddClass(class|fn) \t\t\t\u4e3a\u5143\u7d20\u6dfb\u52a0\u4e00\u4e2aclass\u503c;<div class=\"mini big\">\nremoveClass([class|fn]) \t\u5220\u9664\u5143\u7d20\u7684class\u503c\uff1b\u4f20\u9012\u4e00\u4e2a\u5177\u4f53\u7684class\u503c\uff0c\u5c31\u4f1a\u5220\u9664\u5177\u4f53\u7684\u67d0\u4e2aclass\n\t\t\t\t\t\t\ta.removeClass()\uff1a\u79fb\u9664\u6240\u6709\u7684class\u503c\n\n**\/\n\t\t\n\t\tvar $divEle = $('div:first');\n\t\t\n\t\t$('#btn01').click(function(){\n\t\t\t\/\/addClass() - \u5411\u88ab\u9009\u5143\u7d20\u6dfb\u52a0\u4e00\u4e2a\u6216\u591a\u4e2a\u7c7b\n\t\t\t$divEle.addClass(\"redDiv blackDiv\");\n\t\t});\n\t\t\n\t\t$('#btn02').click(function(){\n\t\t\t\/\/removeClass() - \u4ece\u88ab\u9009\u5143\u7d20\u5220\u9664\u4e00\u4e2a\u6216\u591a\u4e2a\u7c7b \n\t\t\t$divEle.removeClass()\n\t\t});\n\n\t\t\n\t\t$('#btn03').click(function(){\n\t\t\t\/\/toggleClass() - \u5bf9\u88ab\u9009\u5143\u7d20\u8fdb\u884c\u6dfb\u52a0\/\u5220\u9664\u7c7b\u7684\u5207\u6362\u64cd\u4f5c \n\t\t\t\/\/\u5207\u6362\u5c31\u662f\u5982\u679c\u5177\u6709\u8be5\u7c7b\u90a3\u4e48\u5220\u9664\uff0c\u5982\u679c\u6ca1\u6709\u90a3\u4e48\u6dfb\u52a0\u4e0a\n\t\t\t$divEle.toggleClass(\"redDiv\");\n\t\t});\n\t\t\n\t\t$('#btn04').click(function(){\n\t\t\t\/\/offset() - \u8fd4\u56de\u7b2c\u4e00\u4e2a\u5339\u914d\u5143\u7d20\u76f8\u5bf9\u4e8e\u6587\u6863\u7684\u4f4d\u7f6e\u3002\n\t\t\tvar os = $divEle.offset();\n\t\t\t\/\/\u6ce8\u610f\u901a\u8fc7offset\u83b7\u53d6\u5230\u7684\u662f\u4e00\u4e2a\u5bf9\u8c61\uff0c\u8fd9\u4e2a\u5bf9\u8c61\u6709\u4e24\u4e2a\u5c5e\u6027top\u8868\u793a\u9876\u8fb9\u8ddd\uff0cleft\u8868\u793a\u5de6\u8fb9\u8ddd\n\t\t\talert(\"\u9876\u8fb9\u8ddd\uff1a\"+os.top+\" \u5de6\u8fb9\u8ddd\uff1a\"+os.left);\n\t\t\t\n\t\t\t\/\/\u8c03\u7528offset\u8bbe\u7f6e\u5143\u7d20\u4f4d\u7f6e\u65f6\uff0c\u4e5f\u9700\u8981\u4f20\u9012\u4e00\u4e2ajs\u5bf9\u8c61\uff0c\u5bf9\u8c61\u6709\u4e24\u4e2a\u5c5e\u6027top\u548cleft\n\t\t\t\/\/offset({ top: 10, left: 30 });\n\t\t\t $divEle.offset({\n\t\t\t\t top:50,\n\t\t\t\t left:60\n\t\t\t }); \n\t\t});\n\t\t\n\t})\n<\/script>\n<\/head>\n<body>\n\n\t<table align=\"center\">\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<div class=\"border\">\n\t\t\t\t<\/div>\n\t\t\t<\/td>\n\t\t\t\n\t\t\t<td>\n\t\t\t\t<div class=\"btn\">\n\t\t\t\t\t<input type=\"button\" value=\"addClass()\" id=\"btn01\"\/>\n\t\t\t\t\t<input type=\"button\" value=\"removeClass()\" id=\"btn02\"\/>\n\t\t\t\t\t<input type=\"button\" value=\"toggleClass()\" id=\"btn03\"\/>\n\t\t\t\t\t<input type=\"button\" value=\"offset()\" id=\"btn04\"\/>\n\t\t\t\t<\/div>\n\t\t\t<\/td>\n\t\t<\/tr>\n\t<\/table>\n\t\n\t\n\t\n\t<br \/> <br \/>\n\t\n\t\n\t<br \/> <br \/>\n\t\n\t\n\t\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-\u52a8\u753b\u64cd\u4f5c<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<link href=\"css\/style.css\" type=\"text\/css\" rel=\"stylesheet\" \/>\n\t\t<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n\t\n<script type=\"text\/javascript\">\n\t\t\/*\n\t\t\u57fa\u672c\u52a8\u753b\n\t\tshow()\t\t\u5c06\u9690\u85cf\u7684\u5143\u7d20\u663e\u793a\n\t\thide()\t\t\u5c06\u53ef\u89c1\u7684\u5143\u7d20\u9690\u85cf\u3002\n\t\ttoggle()\t\u53ef\u89c1\u5c31\u9690\u85cf\uff0c\u4e0d\u53ef\u89c1\u5c31\u663e\u793a\u3002\n\n\t\t\t\u4ee5\u4e0a\u52a8\u753b\u65b9\u6cd5\u90fd\u53ef\u4ee5\u6dfb\u52a0\u53c2\u6570\u3002\n\t\t\t\t1\u3001\u7b2c\u4e00\u4e2a\u53c2\u6570\u662f\u52a8\u753b \u6267\u884c\u7684\u65f6\u957f\uff0c\u4ee5\u6beb\u79d2\u4e3a\u5355\u4f4d\n\t\t\t\t2\u3001\u7b2c\u4e8c\u4e2a\u53c2\u6570\u662f\u52a8\u753b\u7684\u56de\u8c03\u51fd\u6570 (\u52a8\u753b\u5b8c\u6210\u540e\u81ea\u52a8\u8c03\u7528\u7684\u51fd\u6570)\n\n\t\t\u6de1\u5165\u6de1\u51fa\u52a8\u753b\n\t\tfadeIn()\t\t\u6de1\u5165\uff08\u6162\u6162\u53ef\u89c1\uff09\n\t\tfadeOut()\t\t\u6de1\u51fa\uff08\u6162\u6162\u6d88\u5931\uff09\n\t\tfadeTo()\t\t\u5728\u6307\u5b9a\u65f6\u957f\u5185\u6162\u6162\u7684\u5c06\u900f\u660e\u5ea6\u4fee\u6539\u5230\u6307\u5b9a\u7684\u503c\u30020 \u900f\u660e\uff0c1 \u5b8c\u6210\u53ef\u89c1\uff0c0.5 \u534a\u900f\u660e\n\t\tfadeToggle()\t\u6de1\u5165\/\u6de1\u51fa \u5207\u6362\n\t\t *\/\n\n\t\t$(function(){\n\t\t\t\/\/\u663e\u793a show()\n\t\t\t$(\"#btn1\").click(function(){\n\t\t\t\t$(\"#div1\").show(2000,function () {\n\t\t\t\t\talert(\"show\u52a8\u753b\u5b8c\u6210\");\n\t\t\t\t});\n\n\t\t\t});\n\t\t\t\/\/\u9690\u85cf hide()\n\t\t\t$(\"#btn2\").click(function(){\n\t\t\t\t$(\"#div1\").hide(1000,function () {\n\t\t\t\t\talert(\"hide\u52a8\u753b \u6267\u884c\u5b8c\u6210\");\n\t\t\t\t});\n\t\t\t});\n\t\t\t\/\/\u5207\u6362 toggle()\n\t\t\t$(\"#btn3\").click(function(){\n\t\t\t\t$(\"#div1\").toggle(1000,function () {\n\t\t\t\t\talert(\"toggle\u52a8\u753b \u5b8c\u6210\")\n\t\t\t\t});\n\t\t\t});\n\n\t\t\t\/\/ var abc = function () {\n\t\t\t\/\/ \t$(\"#div1\").toggle(1000,abc);\n\t\t\t\/\/\n\t\t\t\/\/ };\n\t\t\t\/\/ abc();\n\n\t\t\t\/\/\u6de1\u5165 fadeIn()\n\t\t\t$(\"#btn4\").click(function(){\n\t\t\t\t$(\"#div1\").fadeIn(2000,function () {\n\t\t\t\t\talert(\"fadeIn\u5b8c\u6210\");\n\n\t\t\t\t});\n\n\t\t\t});\n\t\t\t\/\/\u6de1\u51fa fadeOut()\n\t\t\t$(\"#btn5\").click(function(){\n\t\t\t\t$(\"#div1\").fadeOut(2000,function () {\n\t\t\t\t\talert(\"fadeOut\u5b8c\u6210\");\n\n\t\t\t\t});\n\n\t\t\t});\n\n\t\t\t\/\/\u6de1\u5316\u5230 fadeTo()\n\t\t\t$(\"#btn6\").click(function(){\n\t\t\t\t$(\"#div1\").fadeTo(2000,0.5,function () {\n\t\t\t\t\talert(\"fadeTo\u5b8c\u6210\");\n\n\t\t\t\t})\n\n\t\t\t});\n\t\t\t\/\/\u6de1\u5316\u5207\u6362 fadeToggle()\n\t\t\t$(\"#btn7\").click(function(){\n\t\t\t\t$(\"#div1\").fadeToggle(1000,function () {\n\t\t\t\t\talert(\"fadeToggle\u5b8c\u6210\");\n\n\t\t\t\t})\n\t\t\t});\n\t\t})\n\n\t\t\/*\n \u57fa\u672c\n show([speed,[easing],[fn]])\n hide([speed,[easing],[fn]])\n toggle([speed],[easing],[fn])\n \u6ed1\u52a8\n slideDown([spe],[eas],[fn])\n slideUp([speed,[easing],[fn]])\n slideToggle([speed],[easing],[fn])\n \u6de1\u5165\u6de1\u51fa\n fadeIn([speed],[eas],[fn])\n fadeOut([speed],[eas],[fn])\n fadeTo([[spe],opa,[eas],[fn]])\n fadeToggle([speed,[eas],[fn]])\n *\/\n<\/script>\n\n\t<\/head>\n\t<body>\n\t\t<table style=\"float: left;\">\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn1\">\u663e\u793ashow()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn2\">\u9690\u85cfhide()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn3\">\u663e\u793a\/\u9690\u85cf\u5207\u6362 toggle()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn4\">\u6de1\u5165fadeIn()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn5\">\u6de1\u51fafadeOut()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn6\">\u6de1\u5316\u5230fadeTo()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn7\">\u6de1\u5316\u5207\u6362fadeToggle()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t<\/table>\n\t\t\n\t\t<div id=\"div1\" style=\"float:left;border: 1px solid;background-color: blue;width: 300px;height: 200px;\">\n\t\t\tjquery\u52a8\u753b\u5b9a\u4e49\u4e86\u5f88\u591a\u79cd\u52a8\u753b\u6548\u679c\uff0c\u53ef\u4ee5\u5f88\u65b9\u4fbf\u7684\u4f7f\u7528\u8fd9\u4e9b\u52a8\u753b\u6548\u679c\n\t\t<\/div>\n\t<\/body>\n\n<\/html>\n<\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<link href=\"css\/style.css\" type=\"text\/css\" rel=\"stylesheet\" \/>\n\t\t<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n\t\n<script type=\"text\/javascript\">\n\t\/* \t\n\t\t\u57fa\u672c\n\t\tshow([speed,[easing],[fn]]) \n\t\thide([speed,[easing],[fn]]) \n\t\ttoggle([speed],[easing],[fn]) \n\t\t\u6ed1\u52a8\n\t\tslideDown([spe],[eas],[fn]) \n\t\tslideUp([speed,[easing],[fn]]) \n\t\tslideToggle([speed],[easing],[fn]) \n\t\t\u6de1\u5165\u6de1\u51fa\n\t\tfadeIn([speed],[eas],[fn]) \n\t\tfadeOut([speed],[eas],[fn]) \n\t\tfadeTo([[spe],opa,[eas],[fn]]) \n\t\tfadeToggle([speed,[eas],[fn]])\n\t\t*\/\n\t\t$(function(){\n\t\t\t\/\/\u663e\u793a show()\n\t\t\t$(\"#btn1\").click(function(){\n\t\t\t\t$(\"#div1\").show(1000);\n\t\t\t});\t\t\n\t\t\t\/\/\u9690\u85cf hide()\n\t\t\t$(\"#btn2\").click(function(){\n\t\t\t\t$(\"#div1\").hide(1000);\n\t\t\t});\t\n\t\t\t\/\/\u5207\u6362 toggle()\n\t\t\t$(\"#btn3\").click(function(){\n\t\t\t\t$(\"#div1\").toggle(1000);\n\t\t\t});\t\n\t\t\t\n\t\t\t\n\t\t\t\/\/\u6de1\u5165 fadeIn()\n\t\t\t$(\"#btn4\").click(function(){\n\t\t\t\t$(\"#div1\").fadeIn(500);\n\t\t\t});\t\n\t\t\t\/\/\u6de1\u51fa fadeOut()\n\t\t\t$(\"#btn5\").click(function(){\n\t\t\t\t$(\"#div1\").fadeOut(500);\n\t\t\t});\t\n\t\t\t\n\t\t\t\/\/\u6de1\u5316\u5230 fadeTo()\n\t\t\t$(\"#btn6\").click(function(){\n\t\t\t\t$(\"#div1\").fadeTo(\"slow\",Math.random());\n\t\t\t});\t\n\t\t\t\/\/\u6de1\u5316\u5207\u6362 fadeToggle()\n\t\t\t$(\"#btn7\").click(function(){\n\t\t\t\t$(\"#div1\").fadeToggle(\"slow\",\"linear\");\n\t\t\t});\t\n\t\t})\n<\/script>\n\t\n\t<\/head>\n\t<body>\n\t\t<table style=\"float: left;\">\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn1\">\u663e\u793ashow()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn2\">\u9690\u85cfhide()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn3\">\u663e\u793a\/\u9690\u85cf\u5207\u6362 toggle()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn4\">\u6de1\u5165fadeIn()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn5\">\u6de1\u51fafadeOut()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn6\">\u6de1\u5316\u5230fadeTo()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td><button id=\"btn7\">\u6de1\u5316\u5207\u6362fadeToggle()<\/button><\/td>\n\t\t\t<\/tr>\n\t\t<\/table>\n\t\t\n\t\t<div id=\"div1\" style=\"float:left;border: 1px solid;background-color: blue;width: 300px;height: 200px;\">\n\t\t\tjquery\u52a8\u753b\u5b9a\u4e49\u4e86\u5f88\u591a\u79cd\u52a8\u753b\u6548\u679c\uff0c\u53ef\u4ee5\u5f88\u65b9\u4fbf\u7684\u4f7f\u7528\u8fd9\u4e9b\u52a8\u753b\u6548\u679c\n\t\t<\/div>\n\t<\/body>\n\n<\/html>\n<\/code><\/pre>\n\n\n\njQuery-\u7ec3\u4e60\uff1a\u54c1\u724c\u5c55\u793a<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd\">\n<html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=utf-8\" \/>\n<title>\u54c1\u724c\u5c55\u793a\u7ec3\u4e60<\/title>\n<style type=\"text\/css\">\n* {\n\tmargin: 0;\n\tpadding: 0;\n}\n\nbody {\n\tfont-size: 12px;\n\ttext-align: center;\n}\n\na {\n\tcolor: #04D;\n\ttext-decoration: none;\n}\n\na:hover {\n\tcolor: #F50;\n\ttext-decoration: underline;\n}\n\n.SubCategoryBox {\n\twidth: 600px;\n\tmargin: 0 auto;\n\ttext-align: center;\n\tmargin-top: 40px;\n}\n\n.SubCategoryBox ul {\n\tlist-style: none;\n}\n\n.SubCategoryBox ul li {\n\tdisplay: block;\n\tfloat: left;\n\twidth: 200px;\n\tline-height: 20px;\n}\n\n.showmore , .showless{\n\tclear: both;\n\ttext-align: center;\n\tpadding-top: 10px;\n}\n\n.showmore a , .showless a{\n\tdisplay: block;\n\twidth: 120px;\n\tmargin: 0 auto;\n\tline-height: 24px;\n\tborder: 1px solid #AAA;\n}\n\n\/*\u540e\u4ee3\u9009\u62e9\u5668*\/\n.showmore a span {\n\tpadding-left: 15px;\n\tbackground: url(img\/down.gif) no-repeat 0 0;\n}\n\n.showless a span {\n\tpadding-left: 15px;\n\tbackground: url(img\/up.gif) no-repeat 0 0;\n}\n\n.promoted a {\n\tcolor: #F50;\n}\n<\/style>\n<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t$(function() {\n\t\t\/\/ \u57fa\u672c\u521d\u59cb\u72b6\u6001\n\t\t$(\"li:gt(5):not(:last)\").hide();\n\n\t\t$(\"div div a\").click(function () {\n\t\t\t\/\/ alert(\"\u4e8b\u4ef6\")\n\n\t\t\t\/\/ \u8ba9\u67d0\u4e9b\u54c1\u724c\uff0c\u663e\u793a\uff0c\u6216\u9690\u85cf\n\t\t\t$(\"li:gt(5):not(:last)\").toggle();\n\n\t\t\t\/\/ \u5224\u65ad \u54c1\u724c\uff0c\u5f53\u524d\u662f\u5426\u53ef\u89c1\n\t\t\tif ($(\"li:gt(5):not(:last)\").is(\":hidden\")) {\n\t\t\t\t\/\/ \u54c1\u724c\u9690\u85cf\u7684\u72b6\u6001\uff1a1 \u663e\u793a\u5168\u90e8\u54c1\u724c\t== \u89d2\u6807\u5411\u4e0b\tshowmore\n\t\t\t\t$(\"div div a span\").text(\"\u663e\u793a\u5168\u90e8\u54c1\u724c\");\n\n\t\t\t\t$(\"div div\").removeClass();\n\t\t\t\t$(\"div div\").addClass(\"showmore\")\n\n\t\t\t\t\/\/ \u53bb\u6389\u9ad8\u4eae\n\t\t\t\t$(\"li:contains('\u660e\u57fa')\").removeClass(\"promoted\");\n\t\t\t\t$(\"li:contains('\u7d22\u5c3c')\").removeClass(\"promoted\");\n\n\t\t\t} else {\n\t\t\t\t\/\/ \u54c1\u724c\u53ef\u89c1\u7684\u72b6\u6001\uff1a2 \u663e\u793a\u7cbe\u7b80\u54c1\u724c\t== \u89d2\u6807\u5411\u4e0a\tshowless\n\t\t\t\t$(\"div div a span\").text(\"\u663e\u793a\u7cbe\u7b80\u54c1\u724c\");\n\n\t\t\t\t$(\"div div\").removeClass();\n\t\t\t\t$(\"div div\").addClass(\"showless\")\n\n\t\t\t\t\/\/ \u52a0\u9ad8\u4eae\n\t\t\t\t$(\"li:contains('\u660e\u57fa')\").addClass(\"promoted\");\n\t\t\t\t$(\"li:contains('\u7d22\u5c3c')\").addClass(\"promoted\");\n\t\t\t}\n\n\t\t\treturn false;\n\t\t})\n\t});\n<\/script>\n<\/head>\n<body>\n\t<div class=\"SubCategoryBox\">\n\t\t<ul>\n\t\t\t<li><a href=\"#\">\u4f73\u80fd<\/a><i>(30440) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u7d22\u5c3c<\/a><i>(27220) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u4e09\u661f<\/a><i>(20808) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u5c3c\u5eb7<\/a><i>(17821) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u677e\u4e0b<\/a><i>(12289) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u5361\u897f\u6b27<\/a><i>(8242) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u5bcc\u58eb<\/a><i>(14894) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u67ef\u8fbe<\/a><i>(9520) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u5bbe\u5f97<\/a><i>(2195) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u7406\u5149<\/a><i>(4114) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u5965\u6797\u5df4\u65af<\/a><i>(12205) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u660e\u57fa<\/a><i>(1466) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u7231\u56fd\u8005<\/a><i>(3091) <\/i><\/li>\n\t\t\t<li><a href=\"#\">\u5176\u5b83\u54c1\u724c\u76f8\u673a<\/a><i>(7275) <\/i><\/li>\n\t\t<\/ul>\n\t\t<div class=\"showmore\">\n\t\t\t<a href=\"more.html\"><span>\u663e\u793a\u5168\u90e8\u54c1\u724c<\/span><\/a>\n\t\t<\/div>\n\t<\/div>\n<\/body>\n<\/html>\n\n<\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd\">\n<html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n\t<head>\n\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=utf-8\" \/>\n\t<title>\u54c1\u724c\u5c55\u793a\u7ec3\u4e60<\/title>\n\t\t<style type=\"text\/css\">\n\t\t\t*{ margin:0; padding:0;}\n\t\t\tbody {font-size:12px;text-align:center;}\n\t\t\ta { color:#04D; text-decoration:none;}\n\t\t\ta:hover { color:#F50; text-decoration:underline;}\n\t\t\t.SubCategoryBox {width:600px; margin:0 auto; text-align:center;margin-top:40px;}\n\t\t\t.SubCategoryBox ul { list-style:none;}\n\t\t\t.SubCategoryBox ul li { display:block; float:left; width:200px; line-height:20px;}\n\t\t\t.showmore { clear:both; text-align:center;padding-top:10px;}\n\t\t\t.showmore a { display:block; width:120px; margin:0 auto; line-height:24px; border:1px solid #AAA;}\n\t\t\t\n\t\t\t.showmore a span { padding-left:15px; background:url(img\/down.gif) no-repeat 0 0;}\n\t\t\t\n\t\t\t.promoted a { color:#F50;}\n\t\t<\/style>\n\t\t<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t$(function(){\n\t\t\t\tvar category = $(\"ul:first li:gt(5):not(:last)\");\n\t\t\t\tcategory.hide();\n\t\t\t\t\n\t\t\t\tvar $promoptedCategory = $(\"ul:first li\").filter(\":contains('\u4f73\u80fd'), :contains('\u5c3c\u5eb7'), :contains('\u5965\u6797\u5df4\u65af')\");\n\t\t\t\t\n\t\t\t\t$(\".showmore a\").click(function(){\n\t\t\t\t\tif(category.is(\":hidden\")){\n\t\t\t\t\t\tcategory.show();\n\t\t\t\t\t\t$promoptedCategory.addClass(\"promoted\");\n\t\t\t\t\t\t$(\".showmore a span\").text(\"\u663e\u793a\u7cbe\u7b80\u54c1\u724c\")\n\t\t\t\t\t\t\t\t\t\t\t .css(\"background\", \"url(img\/up.gif) no-repeat 0 0\");\n\t\t\t\t\t}else{\n\t\t\t\t\t\tcategory.hide();\n\t\t\t\t\t\t$promoptedCategory.removeClass(\"promoted\");\n\t\t\t\t\t\t$(\".showmore a span\").text(\"\u663e\u793a\u5168\u90e8\u54c1\u724c\")\n\t\t\t\t\t\t\t\t\t\t\t .css(\"background\", \"url(img\/down.gif) no-repeat 0 0\");\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\treturn false;\n\t\t\t\t});\n\t\t\t});\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<div class=\"SubCategoryBox\">\n\t\t\t<ul>\n\t\t\t\t<li ><a href=\"#\">\u4f73\u80fd<\/a><i>(30440) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u7d22\u5c3c<\/a><i>(27220) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u4e09\u661f<\/a><i>(20808) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u5c3c\u5eb7<\/a><i>(17821) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u677e\u4e0b<\/a><i>(12289) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u5361\u897f\u6b27<\/a><i>(8242) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u5bcc\u58eb<\/a><i>(14894) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u67ef\u8fbe<\/a><i>(9520) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u5bbe\u5f97<\/a><i>(2195) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u7406\u5149<\/a><i>(4114) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u5965\u6797\u5df4\u65af<\/a><i>(12205) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u660e\u57fa<\/a><i>(1466) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u7231\u56fd\u8005<\/a><i>(3091) <\/i><\/li>\n\t\t\t\t<li ><a href=\"#\">\u5176\u5b83\u54c1\u724c\u76f8\u673a<\/a><i>(7275) <\/i><\/li>\n\t\t\t<\/ul>\n\t\t\t<div class=\"showmore\">\n\t\t\t\t<a href=\"more.html\"><span>\u663e\u793a\u5168\u90e8\u54c1\u724c<\/span><\/a>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/body>\n<\/html>\n\n<\/code><\/pre>\n\n\n\njQuery-\u539f\u751fjs\u548cjQuery\u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u7684\u533a\u522b<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\n\t\/*\n\t$( function(){} );\n\t\u548c\n\twindow.onload = function(){}\n\t\u7684\u533a\u522b\uff1f\n\n\t\u4ed6\u4eec\u5206\u522b\u662f\u5728\u4ec0\u4e48\u65f6\u5019\u89e6\u53d1\uff1f\n\t\t1\u3001jQuery \u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u662f\u6d4f\u89c8\u5668\u7684\u5185\u6838\u89e3\u6790\u5b8c\u9875\u9762\u7684\u6807\u7b7e\u521b\u5efa\u597d DOM \u5bf9\u8c61\u4e4b\u540e\u5c31\u4f1a\u9a6c\u4e0a\u6267\u884c\u3002\n\t\t2\u3001\u539f\u751f js \u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\uff0c\u9664\u4e86\u8981\u7b49\u6d4f\u89c8\u5668\u5185\u6838\u89e3\u6790\u5b8c\u6807\u7b7e\u521b\u5efa\u597d DOM \u5bf9\u8c61\uff0c\u8fd8\u8981\u7b49\u6807\u7b7e\u663e\u793a\u65f6\u9700\u8981\u7684\u5185\u5bb9\u52a0\u8f7d\u5b8c\u6210\u3002\n\n\t\u4ed6\u4eec\u89e6\u53d1\u7684\u987a\u5e8f\uff1f\n\t\t1\u3001jQuery \u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u5148\u6267\u884c\n\t\t2\u3001\u539f\u751f js \u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\n\n\t\u4ed6\u4eec\u6267\u884c\u7684\u6b21\u6570\uff1f\n\t\t1\u3001\u539f\u751f js \u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\uff0c\u53ea\u4f1a\u6267\u884c\u6700\u540e\u4e00\u6b21\u7684\u8d4b\u503c\u51fd\u6570\u3002\n\t\t2\u3001jQuery \u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210\u4e4b\u540e\u662f\u5168\u90e8\u628a\u6ce8\u518c\u7684 function \u51fd\u6570\uff0c\u4f9d\u6b21\u987a\u5e8f\u5168\u90e8\u6267\u884c\u3002\n\t *\/\n\n\t\/\/\u539f\u751fjs\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e\n\twindow.onload = function () {\n\t\talert(\"\u539f\u751fjs\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e--1\")\n\t\t\n\t};\n\twindow.onload = function () {\n\t\talert(\"\u539f\u751fjs\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e--2\")\n\n\t};\n\twindow.onload = function () {\n\t\talert(\"\u539f\u751fjs\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e--3\")\n\n\t};\n\n\t$(document).ready(function () {\n\t\t\n\t})\n\n\t$(function () {\n\t\talert(\"jquery\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e--3\")\n\n\t});\n\t\/\/jquery\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e\n\t$(function () {\n\t\talert(\"jquery\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e--1\")\n\n\t});\n\t$(function () {\n\t\talert(\"jquery\u7684\u9875\u9762\u52a0\u8f7d\u5b8c\u6210 \u4e4b\u540e--2\")\n\n\t});\n\n\t\/\/$(function(){}) \u548c window.onload = function(){}\u7684\u533a\u522b\n\n\t\/\/1\u3001\u5bfc\u5165jquery\u7684.js\u6587\u4ef6\n\t\/\/2\u3001\u53ef\u4ee5\u5728\u5bfc\u5165\u6587\u4ef6\u540e\u7684\u4efb\u610f\u4f4d\u7f6e\n\t\/\/ 1\uff09\u3001\u53ef\u4ee5\u5199\u5728head\u91cc\u9762\uff0c\u5982\u679c\u5199\u5728head\u91cc\u9762\u53ef\u80fd\u5bfc\u81f4\u5143\u7d20\u67e5\u627e\u4e0d\u5230\u7b49\u95ee\u9898\n\t\/\/\t\t\t1-1\u3001\u53ea\u9700\u8981\u628a\u4ee3\u7801\u5199\u5728$(function(){ jquery\u4ee3\u7801 })\n\t\/\/ 2\uff09\u3001\u53ef\u4ee5\u5199\u5728head\u4e4b\u540e\u7684\u4efb\u610f\u4f4d\u7f6e\uff0c\u6211\u4eec\u4e00\u822c\u4e0d\u91c7\u7528\u8fd9\u79cd\u5199\u6cd5\u3002\n\t\/\/\t 3\uff09\u3001\u7efc\u5408\u4ee5\u4e0a\u8003\u8651\uff0c1-1\n\t\/\/3\u3001window.onload & $(function(){})\n\t\/\/window.onload\u53ea\u53ef\u4ee5\u4f7f\u7528\u4e00\u6b21\n\t\/\/$(function(){})\u53ef\u4ee5\u4f7f\u7528\u591a\u6b21\n\n<\/script>\n<\/head>\n<body>\n\t<button>\u6211\u662f\u6309\u94ae<\/button>\n\t\n\t <iframe src=\"http:\/\/localhost:8080\"><\/iframe>\n\t<img src=\"http:\/\/localhost:8080\/1.jpg\" alt=\"\"\/>\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<script type=\"text\/javascript\"><\/script>\n<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\/\/$(function(){}) \u548c window.onload = function(){}\u7684\u533a\u522b\n \twindow.onload = function(){\n\t\t\/\/\u4f1a\u5728\u6574\u4e2a\u9875\u9762\u52a0\u8f7d\u5b8c\u6bd5\u4e4b\u540e\u8c03\u7528\n\t\talert(\"abc\")\n\t}\n\/*\n\t$(function(){\n\t\talert(\"abc\")\/\/\u4f1a\u5728\u5f53\u524d\u6587\u6863\u52a0\u8f7d\u5b8c\u6bd5\u4e4b\u540e\u8c03\u7528\n\t})\n\t\n\t*\/\n\t$(function(){\n\t\talert(\"edf\")\/\/\u4f1a\u5728\u5f53\u524d\u6587\u6863\u52a0\u8f7d\u5b8c\u6bd5\u4e4b\u540e\u8c03\u7528\n\t})\n\t\n\/* \t$(function(){\n\t\talert(\"\u6211\u662fjQuery\u6838\u5fc3\u51fd\u6570\");\n\t});\n\twindow.onload = function(){\n\t\talert(\"window.onload\u51fa\u6765\u4e86\");\n\t}; *\/\n\t\n\t\/\/1\u3001\u5bfc\u5165jquery\u7684.js\u6587\u4ef6\n\t\/\/2\u3001\u53ef\u4ee5\u5728\u5bfc\u5165\u6587\u4ef6\u540e\u7684\u4efb\u610f\u4f4d\u7f6e\n\t\/\/ 1\uff09\u3001\u53ef\u4ee5\u5199\u5728head\u91cc\u9762\uff0c\u5982\u679c\u5199\u5728head\u91cc\u9762\u53ef\u80fd\u5bfc\u81f4\u5143\u7d20\u67e5\u627e\u4e0d\u5230\u7b49\u95ee\u9898\n\t\/\/\t\t\t1-1\u3001\u53ea\u9700\u8981\u628a\u4ee3\u7801\u5199\u5728$(function(){ jquery\u4ee3\u7801 })\n\t\/\/ 2\uff09\u3001\u53ef\u4ee5\u5199\u5728head\u4e4b\u540e\u7684\u4efb\u610f\u4f4d\u7f6e\uff0c\u6211\u4eec\u4e00\u822c\u4e0d\u91c7\u7528\u8fd9\u79cd\u5199\u6cd5\u3002\n\t\/\/\t 3\uff09\u3001\u7efc\u5408\u4ee5\u4e0a\u8003\u8651\uff0c1-1\n\t\/\/3\u3001window.onload & $(function(){})\n\t\/\/window.onload\u53ea\u53ef\u4ee5\u4f7f\u7528\u4e00\u6b21\n\t\/\/$(function(){})\u53ef\u4ee5\u4f7f\u7528\u591a\u6b21\n<\/script>\n<\/head>\n<body>\n\t<button>\u6211\u662f\u6309\u94ae<\/button>\n\t\n\t<!-- <iframe src=\"http:\/\/www.baidu.com\"><\/iframe> -->\n\t\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-jQuery\u4e2d\u5e38\u7528\u7684\u4e8b\u4ef6\u5904\u7406\u65b9\u6cd5<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<link href=\"css\/style.css\" type=\"text\/css\" rel=\"stylesheet\" \/>\n\t\t<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t\/*\n\t\t\tjQuery \u4e2d\u5176\u4ed6\u7684\u4e8b\u4ef6\u5904\u7406\u65b9\u6cd5\uff1a\n\n\t\t\tclick()\t\t\t\u5b83\u53ef\u4ee5\u7ed1\u5b9a\u5355\u51fb\u4e8b\u4ef6\uff0c\u4ee5\u53ca\u89e6\u53d1\u5355\u51fb\u4e8b\u4ef6\n\t\t\tmouseover()\t\t\u9f20\u6807\u79fb\u5165\u4e8b\u4ef6\n\t\t\tmouseout()\t\t\u9f20\u6807\u79fb\u51fa\u4e8b\u4ef6\n\t\t\tbind()\t\t\t\u53ef\u4ee5\u7ed9\u5143\u7d20\u4e00\u6b21\u6027\u7ed1\u5b9a\u4e00\u4e2a\u6216\u591a\u4e2a\u4e8b\u4ef6\u3002\n\t\t\tone()\t\t\t\u4f7f\u7528\u4e0a\u8ddf bind \u4e00\u6837\u3002\u4f46\u662f one \u65b9\u6cd5\u7ed1\u5b9a\u7684\u4e8b\u4ef6\u53ea\u4f1a\u54cd\u5e94\u4e00\u6b21\u3002\n\t\t\tunbind()\t\t\u8ddf bind \u65b9\u6cd5\u76f8\u53cd\u7684\u64cd\u4f5c\uff0c\u89e3\u9664\u4e8b\u4ef6\u7684\u7ed1\u5b9a\n\t\t\tlive()\t\t\t\u4e5f\u662f\u7528\u6765\u7ed1\u5b9a\u4e8b\u4ef6\u3002\u5b83\u53ef\u4ee5\u7528\u6765\u7ed1\u5b9a\u9009\u62e9\u5668\u5339\u914d\u7684\u6240\u6709\u5143\u7d20\u7684\u4e8b\u4ef6\u3002\n\t\t\t\t\t\t\t\t\u54ea\u6015\u8fd9\u4e2a\u5143\u7d20\u662f\u540e\u9762\u52a8\u6001\u521b\u5efa\u51fa\u6765\u7684\u4e5f\u6709\u6548\n\t\t\t *\/\n\t\t\n\t\t\t$(function(){\n\t\t\t\t$(\"h5\").click(function () {\n\t\t\t\t\talert(\"h5\u5355\u51fb\u4e8b\u4ef6 == click\u65b9\u6cd5\u7ed1\u5b9a\");\n\n\t\t\t\t});\n\n\t\t\t\t\/\/\u4f7f\u7528live\u7ed1\u5b9a\u7684\u5355\u51fb\u4e8b\u4ef6\n\t\t\t\t$(\"h5\").live(\"click\",function () {\n\t\t\t\t\talert(\"h5\u5355\u51fb\u4e8b\u4ef6 == live\u65b9\u6cd5\u7ed1\u5b9a\");\n\n\t\t\t\t})\n\n\t\t\t\t$('<h5 class=\"head\">\u4ec0\u4e48\u662fjQuery?<\/h5>').appendTo($(\"#panel\"));\n\n\t\t\t\t$(\"button\").click(function () {\n\t\t\t\t\t$(\"h5\").click(); \/\/ \u4e0d\u4f20function\u662f\u89e6\u53d1\u4e8b\u4ef6\n\n\t\t\t\t});\n\n\t\t\t\t\/\/\u9f20\u6807\u79fb\u5165\n\t\t\t\t$(\"h5\").mouseover(function () {\n\t\t\t\t\tconsole.log(\"\u4f60\u8fdb\u6765\u4e86\")\n\n\t\t\t\t});\n\n\t\t\t\t\/\/\u9f20\u6807\u79fb\u51fa\n\t\t\t\t$(\"h5\").mouseout(function () {\n\t\t\t\t\tconsole.log(\"\u4f60\u51fa\u53bb\u4e86\")\n\n\t\t\t\t});\n\n\t\t\t\t\/\/\u4f7f\u7528bind\u7ed1\u5b9a\u4e8b\u4ef6\n\t\t\t\t$(\"h5\").bind(\"click mouseover mouseout\",function () {\n\t\t\t\t\tconsole.log(\"\u8fd9\u662fbind\u7ed1\u5b9a\u7684\u4e8b\u4ef6\");\n\n\t\t\t\t});\n\n\t\t\t\t\/\/\u4f7f\u7528one\u7ed1\u5b9a\u4e8b\u4ef6\n\t\t\t\t$(\"h5\").one(\"click mouseover mouseout\",function () {\n\t\t\t\t\tconsole.log(\"\u8fd9\u662fone\u7ed1\u5b9a\u7684\u4e8b\u4ef6\");\n\n\t\t\t\t});\n\n\t\t\t\t\/\/\u4f7f\u7528unbind\u89e3\u9664\u7ed1\u5b9a\u4e8b\u4ef6\n\t\t\t\t$(\"h5\").unbind(\"click mouseover\");\n\t\t\t\t$(\"h5\").unbind();\/\/\u89e3\u9664\u7ed1\u5b9a\u7684\u6240\u6709\u4e8b\u4ef6\n\n\n\t\t\t\t\/\/1.\u901a\u5e38\u7ed1\u5b9a\u4e8b\u4ef6\u7684\u65b9\u5f0f\n\t\t\t\t\/\/2.jQuery\u63d0\u4f9b\u7684\u7ed1\u5b9a\u65b9\u5f0f\uff1abind()\u51fd\u6570\n\t\t\t\t\/\/3.\u5408\u5e76\u201c\u9f20\u6807\u79fb\u5165\u201d\u548c\u201c\u9f20\u6807\u79fb\u51fa\u201d\u4e8b\u4ef6\n\t\t\t\t\/\/4.\u5408\u5e76\u5355\u51fb\u4e8b\u4ef6\n\t\t\t\t\/\/5.\u5207\u6362\u5143\u7d20\u53ef\u89c1\u72b6\u6001\n\t\t\t\t\/\/6.\u53ea\u7ed1\u5b9a\u4e00\u6b21\n\t\t\t});\n\t\t\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<div id=\"panel\">\n\t\t\t<h5 class=\"head\">\u4ec0\u4e48\u662fjQuery?<\/h5>\n\t\t\t<div class=\"content\">\n\t\t\t\tjQuery\u662f\u7ee7Prototype\u4e4b\u540e\u53c8\u4e00\u4e2a\u4f18\u79c0\u7684JavaScript\u5e93\uff0c\u5b83\u662f\u4e00\u4e2a\u7531 John Resig \u521b\u5efa\u4e8e2006\u5e741\u6708\u7684\u5f00\u6e90\u9879\u76ee\u3002jQuery\u51ed\u501f\u7b80\u6d01\u7684\u8bed\u6cd5\u548c\u8de8\u5e73\u53f0\u7684\u517c\u5bb9\u6027\uff0c\u6781\u5927\u5730\u7b80\u5316\u4e86JavaScript\u5f00\u53d1\u4eba\u5458\u904d\u5386HTML\u6587\u6863\u3001\u64cd\u4f5cDOM\u3001\u5904\u7406\u4e8b\u4ef6\u3001\u6267\u884c\u52a8\u753b\u548c\u5f00\u53d1Ajax\u3002\u5b83\u72ec\u7279\u800c\u53c8\u4f18\u96c5\u7684\u4ee3\u7801\u98ce\u683c\u6539\u53d8\u4e86JavaScript\u7a0b\u5e8f\u5458\u7684\u8bbe\u8ba1\u601d\u8def\u548c\u7f16\u5199\u7a0b\u5e8f\u7684\u65b9\u5f0f\u3002\n\t\t\t<\/div>\n\t\t\t<button>\u6309\u94ae<\/button>\n\t\t<\/div>\n\t<\/body>\n\n<\/html>\n<\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<link href=\"css\/style.css\" type=\"text\/css\" rel=\"stylesheet\" \/>\n\t\t<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\n\t\t\t$(function(){\n\t\t\t\t\/\/*1.\u901a\u5e38\u7ed1\u5b9a\u4e8b\u4ef6\u7684\u65b9\u5f0f\n\t\t\t\t\/\/\u7ed9\u5143\u7d20\u7ed1\u5b9a\u4e8b\u4ef6 \n\t\t\t\t\/\/jquery\u5bf9\u8c61.\u4e8b\u4ef6\u65b9\u6cd5(\u56de\u8c03\u51fd\u6570(){ \u89e6\u53d1\u4e8b\u4ef6\u6267\u884c\u7684\u4ee3\u7801 }).\u4e8b\u4ef6\u65b9\u6cd5(\u56de\u8c03\u51fd\u6570(){ \u89e6\u53d1\u4e8b\u4ef6\u6267\u884c\u7684\u4ee3\u7801 }).\u4e8b\u4ef6\u65b9\u6cd5(\u56de\u8c03\u51fd\u6570(){ \u89e6\u53d1\u4e8b\u4ef6\u6267\u884c\u7684\u4ee3\u7801 })\n\t\t\t\t\/\/\u7ed1\u5b9a\u4e8b\u4ef6\u53ef\u4ee5\u94fe\u5f0f\u64cd\u4f5c\n\t\t\t\t$(\".head\").click(function(){\n\t\t\t\t\t$(\".content\").toggle();\n\t\t\t\t}).mouseover(function(){\n\t\t\t\t\t$(\".content\").toggle();\n\t\t\t\t}); \n\t\t\t\t\n\t\t\t\t\/\/*2.jQuery\u63d0\u4f9b\u7684\u7ed1\u5b9a\u65b9\u5f0f\uff1abind(type,[data],fn)\u51fd\u6570\u628a\u5143\u7d20\u548c\u4e8b\u4ef6\u7ed1\u5b9a\u8d77\u6765\n\t\t\t\t\/\/type\u8868\u793a\u8981\u7ed1\u5b9a\u7684\u4e8b\u4ef6 [data]\u8868\u793a\u4f20\u5165\u7684\u6570\u636e fn\u8868\u793a\u4e8b\u4ef6\u7684\u5904\u7406\u65b9\u6cd5\n\t\t\t\t\/\/bind(\u4e8b\u4ef6\u5b57\u7b26\u4e32,\u56de\u8c03\u51fd\u6570),\u540e\u6765\u6dfb\u52a0\u7684\u5143\u7d20\u4e0d\u4f1a\u7ed1\u5b9a\u4e8b\u4ef6\n\t\t\t\t\/\/\u4f7f\u7528bind()\u7ed1\u5b9a\u591a\u4e2a\u4e8b\u4ef6 type\u53ef\u4ee5\u63a5\u53d7\u591a\u4e2a\u4e8b\u4ef6\u7c7b\u578b\uff0c\u4f7f\u7528\u7a7a\u683c\u5206\u5272\u591a\u4e2a\u4e8b\u4ef6\n\t\t\t\t\/* $(\".head\").bind(\"click mouseover\",function(){\n\t\t\t\t\t$(\".content\").toggle();\n\t\t\t\t}); *\/\n\t\t\t\n\t\t\t\t\n\t\t\t\t\/\/3.one()\u53ea\u7ed1\u5b9a\u4e00\u6b21,\u7ed1\u5b9a\u7684\u4e8b\u4ef6\u53ea\u4f1a\u53d1\u751f\u4e00\u6b21one(type,[data],fn)\u51fd\u6570\u628a\u5143\u7d20\u548c\u4e8b\u4ef6\u7ed1\u5b9a\u8d77\u6765\n\t\t\t\t\/\/type\u8868\u793a\u8981\u7ed1\u5b9a\u7684\u4e8b\u4ef6 [data]\u8868\u793a\u4f20\u5165\u7684\u6570\u636e fn\u8868\u793a\u4e8b\u4ef6\u7684\u5904\u7406\u65b9\u6cd5\n\t\t\t\/* \t$(\".head\").one(\"click mouseover\",function(){\n\t\t\t\t\t$(\".content\").toggle();\n\t\t\t\t}); *\/\n\n\t\t\t\t\/\/4.live\u65b9\u6cd5\u4f1a\u4e3a\u73b0\u5728\u53ca\u4ee5\u540e\u6dfb\u52a0\u7684\u5143\u7d20\u90fd\u7ed1\u5b9a\u4e0a\u76f8\u5e94\u7684\u4e8b\u4ef6\n\t\t\t\/**\t$(\".head\").live(\"click\",function(){\n\t\t\t\t\t$(\".content\").toggle();\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"#panel\").before(\"<h5 class='head'>\u4ec0\u4e48\u662fjQuery?<\/h5>\");\n\t\t\t*\/\n\t\t\t});\n\t\t\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<div id=\"panel\">\n\t\t\t<h5 class=\"head\">\u4ec0\u4e48\u662fjQuery?<\/h5>\n\t\t\t<div class=\"content\">\n\t\t\t\tjQuery\u662f\u7ee7Prototype\u4e4b\u540e\u53c8\u4e00\u4e2a\u4f18\u79c0\u7684JavaScript\u5e93\uff0c\u5b83\u662f\u4e00\u4e2a\u7531 John Resig \u521b\u5efa\u4e8e2006\u5e741\u6708\u7684\u5f00\u6e90\u9879\u76ee\u3002jQuery\u51ed\u501f\u7b80\u6d01\u7684\u8bed\u6cd5\u548c\u8de8\u5e73\u53f0\u7684\u517c\u5bb9\u6027\uff0c\u6781\u5927\u5730\u7b80\u5316\u4e86JavaScript\u5f00\u53d1\u4eba\u5458\u904d\u5386HTML\u6587\u6863\u3001\u64cd\u4f5cDOM\u3001\u5904\u7406\u4e8b\u4ef6\u3001\u6267\u884c\u52a8\u753b\u548c\u5f00\u53d1Ajax\u3002\u5b83\u72ec\u7279\u800c\u53c8\u4f18\u96c5\u7684\u4ee3\u7801\u98ce\u683c\u6539\u53d8\u4e86JavaScript\u7a0b\u5e8f\u5458\u7684\u8bbe\u8ba1\u601d\u8def\u548c\u7f16\u5199\u7a0b\u5e8f\u7684\u65b9\u5f0f\u3002\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/body>\n\n<\/html>\n<\/code><\/pre>\n\n\n\njQuery-\u4e8b\u4ef6\u7684\u5192\u6ce1<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<style type=\"text\/css\">\n\t\t\t*{\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tbody{\n\t\t\t\tfont-size: 13px;\n\t\t\t\tline-height: 130%;\n\t\t\t\tpadding: 60px;\n\t\t\t}\n\t\t\t#content{\n\t\t\t\twidth: 220px;\n\t\t\t\tborder: 1px solid #0050D0;\n\t\t\t\tbackground: #96E555;\n\t\t\t}\n\t\t\tspan{\n\t\t\t\twidth: 200px;\n\t\t\t\tmargin: 10px;\n\t\t\t\tbackground: #666666;\n\t\t\t\tcursor: pointer;\n\t\t\t\tcolor: white;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\t\t\tp{\n\t\t\t\twidth: 200px;\n\t\t\t\tbackground: #888;\n\t\t\t\tcolor: white;\n\t\t\t\theight: 16px;\n\t\t\t}\n\t\t<\/style>\n\t\t<script type=\"text\/javascript\" src=\"jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t\/*\n\t\t\t\u4e8b\u4ef6\u7684\u5192\u6ce1\n\n\t\t\t\u4ec0\u4e48\u662f\u4e8b\u4ef6\u7684\u5192\u6ce1\uff1f\n\t\t\t\u4e8b\u4ef6\u7684\u5192\u6ce1\u662f\u6307\uff0c\u7236\u5b50\u5143\u7d20\u540c\u65f6\u76d1\u542c\u540c\u4e00\u4e2a\u4e8b\u4ef6\u3002\u5f53\u89e6\u53d1\u5b50\u5143\u7d20\u7684\u4e8b\u4ef6\u7684\u65f6\u5019\uff0c\u540c\u4e00\u4e2a\u4e8b\u4ef6\u4e5f\u88ab\u4f20\u9012\u5230\u4e86\u7236\u5143\u7d20\u7684\u4e8b\u4ef6\u91cc\u53bb\u54cd\u5e94\u3002\n\n\t\t\t\u90a3\u4e48\u5982\u4f55\u963b\u6b62\u4e8b\u4ef6\u5192\u6ce1\u5462\uff1f\n\t\t\t\u5728\u5b50\u5143\u7d20\u4e8b\u4ef6\u51fd\u6570\u4f53\u5185\uff0creturn false; \u53ef\u4ee5\u963b\u6b62\u4e8b\u4ef6\u7684\u5192\u6ce1\u4f20\u9012\u3002\n\t\t\t *\/\n\n\t\t\t$(function(){\n\t\t\t\t$(\"#content\").click(function () {\n\t\t\t\t\talert(\"\u6211\u662fdiv\")\n\n\t\t\t\t});\n\n\t\t\t\t$(\"#span\").click(function () {\n\t\t\t\t\talert(\"\u6211\u662fspan\")\n\n\t\t\t\t\treturn false;\n\t\t\t\t});\n\t\t\t})\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<div id=\"content\">\n\t\t\t\u5916\u5c42div\u5143\u7d20\n\t\t\t<span>\u5185\u5c42span\u5143\u7d20<\/span>\n\t\t\t\u5916\u5c42div\u5143\u7d20\n\t\t<\/div>\n\t\t\n\t\t<div id=\"msg\"><\/div>\t\n\t\t\n\t\t<br><br>\n\t\t<a href=\"http:\/\/www.hao123.com\">WWW.HAO123.COM<\/a>\t\n\t<\/body>\n<\/html>\n\n<\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<style type=\"text\/css\">\n\t\t\t*{\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tbody{\n\t\t\t\tfont-size: 13px;\n\t\t\t\tline-height: 130%;\n\t\t\t\tpadding: 60px;\n\t\t\t}\n\t\t\t#content{\n\t\t\t\twidth: 220px;\n\t\t\t\tborder: 1px solid #0050D0;\n\t\t\t\tbackground: #96E555;\n\t\t\t}\n\t\t\tspan{\n\t\t\t\twidth: 200px;\n\t\t\t\tmargin: 10px;\n\t\t\t\tbackground: #666666;\n\t\t\t\tcursor: pointer;\n\t\t\t\tcolor: white;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\t\t\tp{\n\t\t\t\twidth: 200px;\n\t\t\t\tbackground: #888;\n\t\t\t\tcolor: white;\n\t\t\t\theight: 16px;\n\t\t\t}\n\t\t<\/style>\n\t\t<script type=\"text\/javascript\" src=\"jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t$(function(){\n\t\t\t\t\n\t\t\t\t\/\/\u5192\u6ce1\u5c31\u662f\u4e8b\u4ef6\u7684\u5411\u4e0a\u4f20\u5bfc\uff0c\u5b50\u5143\u7d20\u7684\u4e8b\u4ef6\u88ab\u89e6\u53d1\uff0c\u7236\u5143\u7d20\u7684\u54cd\u5e94\u4e8b\u4ef6\u4e5f\u4f1a\u89e6\u53d1\n\t\t\t\t\/\/\u89e3\u51b3\u5192\u6ce1\u95ee\u9898\uff1areturn false;\n\t\t\t\t\n\t\t\t\t\/\/\u7ed9span\u7ed1\u5b9a\u4e00\u4e2a\u5355\u51fb\u54cd\u5e94\u51fd\u6570\n\t\t\t\t$(\"span\").click(function(){\n\t\t\t\t\talert(\"\u6211\u662fspan\u7684\u5355\u51fb\u54cd\u5e94\u51fd\u6570\");\n\t\t\t\t\treturn false;\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\/\/\u7ed9id\u4e3acontent\u7684div\u7ed1\u5b9a\u4e00\u4e2a\u5355\u51fb\u54cd\u5e94\u51fd\u6570\n\t\t\t\t$(\"#content\").click(function(){\n\t\t\t\t\talert(\"\u6211\u662fdiv\u7684\u5355\u51fb\u54cd\u5e94\u51fd\u6570\");\n\t\t\t\t\treturn false;\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\/\/\u7ed9body\u7ed1\u5b9a\u4e00\u4e2a\u5355\u51fb\u54cd\u5e94\u51fd\u6570\n\t\t\t\t$(\"body\").click(function(){\n\t\t\t\t\t\/\/alert(\"\u6211\u662fbody\u7684\u5355\u51fb\u54cd\u5e94\u51fd\u6570\");\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\/\/\u53d6\u6d88\u9ed8\u8ba4\u884c\u4e3a\n\t\t\t\t\/* $(\"a\").click(function(){\n\t\t\t\t\treturn false;\n\t\t\t\t}) *\/\n\t\t\t\t\n\t\t\t})\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<div id=\"content\">\n\t\t\t\u5916\u5c42div\u5143\u7d20\n\t\t\t<span>\u5185\u5c42span\u5143\u7d20<\/span>\n\t\t\t\u5916\u5c42div\u5143\u7d20\n\t\t<\/div>\n\t\t\n\t\t<div id=\"msg\"><\/div>\t\n\t\t\n\t\t<br><br>\n\t\t<a href=\"http:\/\/www.hao123.com\" onclick=\"return false;\">WWW.HAO123.COM<\/a>\t\n\t<\/body>\n<\/html>\n\n<\/code><\/pre>\n\n\n\njQuery-\u4e8b\u4ef6\u5bf9\u8c61<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<style type=\"text\/css\">\n\n\t#areaDiv {\n\t\tborder: 1px solid black;\n\t\twidth: 300px;\n\t\theight: 50px;\n\t\tmargin-bottom: 10px;\n\t}\n\t\n\t#showMsg {\n\t\tborder: 1px solid black;\n\t\twidth: 300px;\n\t\theight: 20px;\n\t}\n\n<\/style>\n<script type=\"text\/javascript\" src=\"jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\/*\n\tjavaScript \u4e8b\u4ef6\u5bf9\u8c61\n\n\t\u4e8b\u4ef6\u5bf9\u8c61\uff0c\u662f\u5c01\u88c5\u6709\u89e6\u53d1\u7684\u4e8b\u4ef6\u4fe1\u606f\u7684\u4e00\u4e2a javascript \u5bf9\u8c61\u3002\n\t\u6211\u4eec\u91cd\u70b9\u5173\u5fc3\u7684\u662f\u600e\u4e48\u62ff\u5230\u8fd9\u4e2a javascript \u7684\u4e8b\u4ef6\u5bf9\u8c61\u3002\u4ee5\u53ca\u4f7f\u7528\u3002\n\n\t\u5982\u4f55\u83b7\u53d6\u5462 javascript \u4e8b\u4ef6\u5bf9\u8c61\u5462\uff1f\n\t\u5728\u7ed9\u5143\u7d20\u7ed1\u5b9a\u4e8b\u4ef6\u7684\u65f6\u5019\uff0c\u5728\u4e8b\u4ef6\u7684 function( event ) \u53c2\u6570\u5217\u8868\u4e2d\u6dfb\u52a0\u4e00\u4e2a\u53c2\u6570\uff0c\u8fd9\u4e2a\u53c2\u6570\u540d\uff0c\u6211\u4eec\u4e60\u60ef\u53d6\u540d\u4e3a event\u3002\n\t\u8fd9\u4e2a event \u5c31\u662f javascript \u4f20\u9012\u53c2\u4e8b\u4ef6\u5904\u7406\u51fd\u6570\u7684\u4e8b\u4ef6\u5bf9\u8c61\u3002\n\t *\/\n\n\t\/\/1.\u539f\u751fjavascript\u83b7\u53d6 \u4e8b\u4ef6\u5bf9\u8c61\n\twindow.onload = function () {\n\t\tdocument.getElementById(\"areaDiv\").onclick = function (event) {\n\t\t\tconsole.log(event);\n\t\t}\n\n\t}\n\n\t\/\/2.JQuery\u4ee3\u7801\u83b7\u53d6 \u4e8b\u4ef6\u5bf9\u8c61\n\t$(function () {\n\t\t$(\"#areaDiv\").click(function (event) {\n\t\t\tconsole.log(event);\n\t\t});\n\n\t\t\/\/3.\u4f7f\u7528bind\u540c\u65f6\u5bf9\u591a\u4e2a\u4e8b\u4ef6\u7ed1\u5b9a\u540c\u4e00\u4e2a\u51fd\u6570\u3002\u600e\u4e48\u83b7\u53d6\u5f53\u524d\u64cd\u4f5c\u662f\u4ec0\u4e48\u4e8b\u4ef6\u3002\n\n\t\t$(\"#areaDiv\").bind(\"mouseover mouseout\",function (event) {\n\n\t\t\t\/\/ console.log(\"bind\u7ed1\u5b9a\u7684\u79fb\u5165\uff0c\u79fb\u51fa \u4e8b\u4ef6\");\n\t\t\t\/\/ console.log(event);\n\n\t\t\tif (event.type == \"mouseover\"){\n\t\t\t\tconsole.log(\"\u9f20\u6807\u79fb\u5165\");\n\t\t\t} else if (event.type == \"mouseout\"){\n\t\t\t\tconsole.log(\"\u9f20\u6807\u79fb\u51fa\");\n\t\t\t}\n\n\t\t})\n\t})\n\n\n<\/script>\n<\/head>\n<body>\n\n\t<div id=\"areaDiv\"><\/div>\n\t<div id=\"showMsg\"><\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<style type=\"text\/css\">\n\n\t#areaDiv {\n\t\tborder: 1px solid black;\n\t\twidth: 300px;\n\t\theight: 50px;\n\t\tmargin-bottom: 10px;\n\t}\n\t\n\t#showMsg {\n\t\tborder: 1px solid black;\n\t\twidth: 300px;\n\t\theight: 20px;\n\t}\n\n<\/style>\n<script type=\"text\/javascript\" src=\"jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t\/\/\u5f53\u6211\u4eec\u53d1\u751f\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u540e\uff0c\u67d0\u4e2a\u4e8b\u4ef6\u5176\u5b9e\u5c31\u662f\u4e00\u4e2a\u5bf9\u8c61\u3002\u4e8b\u4ef6\u5bf9\u8c61\n\t\/\/\u4f7f\u7528jquery\u83b7\u53d6\u4e8b\u4ef6\u5bf9\u8c61\uff0c\u5728\u56de\u8c03\u51fd\u6570\u4e2d\u4f20\u5165event\u53c2\u6570\uff0cevent\u662fjquery\u5b9a\u4e49\u597d\u7684\u4e00\u4e2a\u53d8\u91cf\n\t$(function(){\n\t\t$(\"#areaDiv\").mousemove(function(event){\n\t\t\t$(\"#showMsg2\").text(\"x=\"+event.screenX+\" y=\"+event.screenY)\t\n\t\t})\n\t})\n\n\twindow.onload = function(){\n\t\t\/\/\u4f7f\u7528js\u83b7\u53d6\u4e8b\u4ef6\u5bf9\u8c61\n\t\tvar areaDiv = document.getElementById(\"areaDiv\");\n\t\tvar showMsg = document.getElementById(\"showMsg\");\n\t\t\/\/\u540c\u6837\u662f\u5c06event\u4f20\u5165\u56de\u8c03\u51fd\u6570\n\t\tareaDiv.onmousemove = function(event){\n\t\t\tvar x = event.pageX;\/\/\u5f53\u524d\u9875\u9762\u7684\u5750\u6807\n\t\t\tvar y = event.pageY;\/\/Y\n\t\t\tshowMsg.innerHTML = \"x=\"+x+\" y=\"+y;\n\t\t};\n\t}\n\t\n\t\n\n \t\/* window.onload = function(){\n\t\tvar areaDiv = document.getElementById(\"areaDiv\");\n\t\tvar showMsg = document.getElementById(\"showMsg\");\n\t\tareaDiv.onmousemove = function(event){\n\t\t\tvar x = event.pageX;\n\t\t\tvar y = event.pageY;\n\t\t\tshowMsg.innerHTML = \"x=\"+x+\" y=\"+y;\n\t\t};\n\t}\n\t\n\t$(function(){\n\t\t$(\"#areaDiv\").mousemove(function(event){\n\t\t\t$(\"#showMsg2\").text(\"x=\"+event.screenX+\" y=\"+event.screenY)\t\t\n\t\t})\n\t}) *\/\n<\/script>\n<\/head>\n<body>\n\n\t<div id=\"areaDiv\"><\/div>\n\t<div id=\"showMsg\"><\/div>\n\t<div id=\"showMsg2\"><\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\njQuery-\u7ec3\u4e60\uff1a\u56fe\u7247\u8ddf\u968f<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<style type=\"text\/css\">\n\tbody {\n\t\ttext-align: center;\n\t}\n\t#small {\n\t\tmargin-top: 150px;\n\t}\n\t#showBig {\n\t\tposition: absolute;\n\t\tdisplay: none;\n\t}\n<\/style>\n<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t$(function(){\n\t\t$(\"#small\").bind(\"mouseover mouseout mousemove\",function (event) {\n\t\t\tif (event.type == \"mouseover\"){\n\t\t\t\t$(\"#showBig\").show();\n\t\t\t} else if (event.type == \"mouseout\") {\n\t\t\t\t$(\"#showBig\").hide();\n\t\t\t} else if (event.type == \"mousemove\") {\n\t\t\t\t$(\"#showBig\").offset({\n\t\t\t\t\tleft: event.pageX + 10,\n\t\t\t\t\ttop: event.pageY + 10\n\t\t\t\t})\n\n\t\t\t}\n\n\t\t})\n\t});\n<\/script>\n<\/head>\n<body>\n\n\t<img id=\"small\" src=\"img\/small.jpg\" \/>\n\t\n\t<div id=\"showBig\">\n\t\t<img src=\"img\/big.jpg\">\n\t<\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\">\n<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n<title>Insert title here<\/title>\n<style type=\"text\/css\">\n\tbody {\n\t\ttext-align: center;\n\t}\n\t#small {\n\t\tmargin-top: 150px;\n\t}\n\t#showBig {\n\t\tposition: absolute;\n\t\tdisplay: none;\n\t}\n<\/style>\n<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n<script type=\"text\/javascript\">\n\t$(function(){\n\t\t$(\"#small\")\n\t\t\t.mouseover(function(event){\n\t\t\t\t$(\"#showBig\")\n\t\t\t\t\t.show()\n\t\t\t\t\t.css(\"left\",event.pageX+10)\n\t\t\t\t\t.css(\"top\",event.pageY+10);\n\t\t\t})\n\t\t\t.mousemove(function(event){\n\t\t\t\t$(\"#showBig\")\n\t\t\t\t\t.css(\"left\",event.pageX+10)\n\t\t\t\t\t.css(\"top\",event.pageY+10);\n\t\t\t})\n\t\t\t.mouseout(function(){\n\t\t\t\t$(\"#showBig\").hide();\n\t\t\t});\n\t});\n<\/script>\n<\/head>\n<body>\n\n\t<img id=\"small\" src=\"img\/small.jpg\" \/>\n\t\n\t<div id=\"showBig\">\n\t\t<img src=\"img\/big.jpg\">\n\t<\/div>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n\u4e8b\u4ef6\u79fb\u9664<\/p>\n\n\n\n
<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<link rel=\"stylesheet\" type=\"text\/css\" href=\"style\/css.css\" \/>\n\t\t<script type=\"text\/javascript\" src=\"jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t$(function(){\n\t\t\t\t\/\/\u7ed9li\u7ed1\u5b9a\u4e24\u79cd\u4e8b\u4ef6\uff1a\u5355\u51fb\u548c\u9f20\u6807\u79fb\u5165\n\t\t\t\t$(\"li\").bind(\"click mouseenter\" , function(){\n\t\t\t\t\talert(this.innerHTML);\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\/\/\u70b9\u51fb\u7b2c\u4e00\u4e2abutton\uff0c\u5c06#bj\u4e0a\u7684mouseenter\u4e8b\u4ef6\u79fb\u9664\n\t\t\t\t\/\/unbind()\u53ef\u4ee5\u79fb\u9664\u6307\u5b9a\u7684\u4e8b\u4ef6\uff0c\u53ea\u9700\u8981\u4f20\u4e00\u4e2a\u4e8b\u4ef6\u540d\u4f5c\u4e3a\u53c2\u6570\n\t\t\t\t\/\/unbind(type,[data|fn]])\n\t\t\t\t\/\/type\u4e8b\u4ef6\u7c7b\u578b \u5f53\u4f20\u5165type\u7684\u65f6\u5019\u4f1a\u89e3\u9664type\u4e8b\u4ef6\n\t\t\t\t\/\/\u5982\u679c\u6ca1\u6709\u4f20\u5165type\u503c\uff0c\u4f1a\u79fb\u9664\u6240\u6709\u4e8b\u4ef6\n\t\t\t\t$(\"button:eq(0)\").click(function(){\n\t\t\t\t\t$(\"li\").unbind(\"click mouseenter\");\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t\/\/\u70b9\u51fb\u7b2c\u4e8c\u4e2abutton\uff0c\u5c06#rl\u4e0a\u7684\u6240\u6709\u4e8b\u4ef6\u79fb\u9664\n\t\t\t\t$(\"button:eq(1)\").click(function(){\n\t\t\t\t\t\n\t\t\t\t});\n\t\t\t});\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<div id=\"total\">\n\t\t\t<div class=\"inner\">\n\t\t\t\t<p>\n\t\t\t\t\t\u4f60\u559c\u6b22\u54ea\u4e2a\u57ce\u5e02?\n\t\t\t\t<\/p>\n\n\t\t\t\t<ul id=\"city\">\n\t\t\t\t\t<li id=\"bj\">\u5317\u4eac<\/li>\n\t\t\t\t\t<li>\u4e0a\u6d77<\/li>\n\t\t\t\t\t<li>\u4e1c\u4eac<\/li>\n\t\t\t\t\t<li>\u9996\u5c14<\/li>\n\t\t\t\t<\/ul>\n\n\t\t\t\t<br>\n\t\t\t\t<br>\n\n\t\t\t\t<p>\n\t\t\t\t\t\u4f60\u559c\u6b22\u54ea\u6b3e\u5355\u673a\u6e38\u620f?\n\t\t\t\t<\/p>\n\n\t\t\t\t<ul id=\"game\">\n\t\t\t\t\t<li id=\"rl\">\u7ea2\u8b66<\/li>\n\t\t\t\t\t<li>\u5b9e\u51b5<\/li>\n\t\t\t\t\t<li>\u6781\u54c1\u98de\u8f66<\/li>\n\t\t\t\t\t<li>\u9b54\u517d<\/li>\n\t\t\t\t<\/ul>\n\t\t\t<\/div>\n\t\t\t<button>\u79fb\u9664#bj\u7684mouseenter\u4e8b\u4ef6<\/button>\n\t\t\t<button>\u79fb\u9664#rl\u6240\u6709\u4e8b\u4ef6<\/button>\n\t\t<\/div>\n\t<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n\u9009\u62e9\u5668\u7ec3\u4e6001 \u9694\u884c\u53d8\u8272\n<\/pre>\n\n\n\n<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<script type=\"text\/javascript\" src=\"script\/jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t\n\t\t\t$(document).ready(function(){\n\t\t\t\t$(\"p\").click(function(){\n\t\t\t\t\talert(\"^^\" + $(this).text());\n\t\t\t\t});\t\n\t\t\t\t\n\t\t\t\t$(\"table:eq(1) tr:even\").css(\"background\", \"#aaffbb\");\n\t\t\t\t\n\t\t\t\t$(\":button\").click(function(){\n\t\t\t\t\talert($(\":checkbox:checked\").length);\n\t\t\t\t});\n\t\t\t});\n\t\t\t\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t<p>\u6bb5\u843d1<\/p>\n\t\t<p>\u6bb5\u843d2<\/p>\n\t\t<p>\u6bb5\u843d3<\/p>\n\t\t\n\t\t<table>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t<\/table>\n\t\t\n\t\t<table>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t\t<tr>\n\t\t\t\t<td>\u7b2c\u4e00\u884c<\/td><td>\u7b2c\u4e00\u884c<\/td>\n\t\t\t<\/tr>\n\t\t<\/table>\n\t\t\n\t\t<input type=\"checkbox\" name=\"test\" \/>\n\t\t<input type=\"checkbox\" name=\"test\" \/>\n\t\t<input type=\"checkbox\" name=\"test\" \/>\n\t\t<input type=\"checkbox\" name=\"test\" \/>\n\t\t<input type=\"checkbox\" name=\"test\" \/>\n\t\t<input type=\"checkbox\" name=\"test\" \/>\n\t\t<button>\u60a8\u9009\u4e2d\u7684\u4e2a\u6570<\/button>\n\t<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n\u9009\u62e9\u5668\u7ec3\u4e6003 \u8868\u5355\u9009\u62e9\u5668<\/pre>\n\n\n\n<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01\/\/EN\" \"http:\/\/www.w3.org\/TR\/html4\/strict.dtd\">\n<html>\n\t<head>\n\t\t<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\">\n\t\t<title>Untitled Document<\/title>\n\t\t<script type=\"text\/javascript\" src=\"..\/..\/script\/jquery-1.7.2.js\"><\/script>\n\t\t<script type=\"text\/javascript\">\n\t\t\t$(function(){\n\t\t\t\t\n\t\t\t\t$(\"input[type=button]:eq(0)\").click(function(){\n\t\t\t\t\t\/\/$(\"#single :option:eq(2)\").attr(\"selected\", \"selected\");\n\t\t\t\t\t$(\"#single\").val([\"s3\"]);\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"input[type=button]:eq(1)\").click(function(){\n\t\t\t\t\t$(\"#multiple\").val([\"x2\", \"x4\"]);\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"input[type=button]:eq(2)\").click(function(){\n\t\t\t\t\t$(\":checkbox\").val([\"check2\", \"check4\"]);\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"input[type=button]:eq(3)\").click(function(){\n\t\t\t\t\t$(\":radio\").val([\"radio2\"]);\n\t\t\t\t});\n\t\t\t\t\n\t\t\t\t$(\"input[type=button]:eq(4)\").click(function(){\n\t\t\t\t\t$(\"#single\")\n\t\t\t\t\t\t.add(\"#multiple\")\n\t\t\t\t\t\t.add(\":checkbox:checked\")\n\t\t\t\t\t\t.add(\":radio:checked\")\n\t\t\t\t\t\t.each(function(){\n\t\t\t\t\t\t\talert($(this).val());\n\t\t\t\t\t\t});\n\t\t\t\t});\n\t\t\t});\n\t\t<\/script>\n\t<\/head>\n\t<body>\n\t\t\n\t\t<input type=\"button\" value=\"\u4f7f\u5355\u9009\u4e0b\u62c9\u6846\u7684'\u9009\u62e93\u53f7'\u88ab\u9009\u4e2d\"\/>\n\t\t<input type=\"button\" value=\"\u4f7f\u591a\u9009\u4e0b\u62c9\u6846\u9009\u4e2d\u7684'\u9009\u62e92\u53f7'\u548c'\u9009\u62e94\u53f7'\u88ab\u9009\u4e2d\"\/><br>\n\t\t<input type=\"button\" value=\"\u4f7f\u591a\u9009\u6846\u7684'\u591a\u90092'\u548c'\u591a\u90094'\u88ab\u9009\u4e2d\"\/>\n\t\t<input type=\"button\" value=\"\u4f7f\u5355\u9009\u6846\u7684'\u5355\u90092'\u88ab\u9009\u4e2d\"\/><br>\n\t\t<input type=\"button\" value=\"\u6253\u5370\u5df2\u7ecf\u88ab\u9009\u4e2d\u7684\u503c\"><br>\n \n\t\t<br\/>\n\t\t\n\t\t<select id=\"single\" name=\"singlecheck\">\n\t\t <option value=\"s1\">\u9009\u62e91\u53f7<\/option>\n\t\t <option value=\"s2\">\u9009\u62e92\u53f7<\/option>\n\t\t <option value=\"s3\">\u9009\u62e93\u53f7<\/option>\n\t\t<\/select>\n\t\t\n\t\t<select id=\"multiple\" multiple=\"multiple\" name=\"multiplecheck\" style=\"height:120px;\">\n\t\t <option selected=\"selected\" value=\"x1\">\u9009\u62e91\u53f7<\/option>\n\t\t <option value=\"x2\">\u9009\u62e92\u53f7<\/option>\n\t\t <option value=\"x3\">\u9009\u62e93\u53f7<\/option>\n\t\t <option value=\"x4\">\u9009\u62e94\u53f7<\/option>\n\t\t <option selected=\"selected\" value=\"x5\">\u9009\u62e95\u53f7<\/option>\n\t\t<\/select>\n\t\t\n\t\t<br\/><br\/>\n\n\t\t<input type=\"checkbox\" name=\"c\" value=\"check1\"\/> \u591a\u90091\n\t\t<input type=\"checkbox\" name=\"c\" value=\"check2\"\/> \u591a\u90092\n\t\t<input type=\"checkbox\" name=\"c\" value=\"check3\"\/> \u591a\u90093\n\t\t<input type=\"checkbox\" name=\"c\" value=\"check4\"\/> \u591a\u90094\n\t\t\n\t\t<br\/>\n\t\t\n\t\t<input type=\"radio\" name=\"r\" value=\"radio1\"\/> \u5355\u90091\n\t\t<input type=\"radio\" name=\"r\" value=\"radio2\"\/> \u5355\u90092\n\t\t<input type=\"radio\" name=\"r\" value=\"radio3\"\/> \u5355\u90093\n\n\t<\/body>\n<\/html>\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"jQuery-html()\u3001text()\u3001val()\u65b9\u6cd5 jQuery-attr() \u548c prop() \u65b9\u6cd5 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[59],"tags":[61],"class_list":["post-2039","post","type-post","status-publish","format-standard","hentry","category-javaweb-code","tag-javaweb"],"_links":{"self":[{"href":"https:\/\/qaqaq.top\/index.php?rest_route=\/wp\/v2\/posts\/2039"}],"collection":[{"href":"https:\/\/qaqaq.top\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/qaqaq.top\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/qaqaq.top\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/qaqaq.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2039"}],"version-history":[{"count":3,"href":"https:\/\/qaqaq.top\/index.php?rest_route=\/wp\/v2\/posts\/2039\/revisions"}],"predecessor-version":[{"id":2692,"href":"https:\/\/qaqaq.top\/index.php?rest_route=\/wp\/v2\/posts\/2039\/revisions\/2692"}],"wp:attachment":[{"href":"https:\/\/qaqaq.top\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2039"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/qaqaq.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2039"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/qaqaq.top\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2039"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}