[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"detail-sidebar-cat-1-en-105":3,"doc-seo-573642-105":53,"doc-detail-573642-en":120},{"code":4,"msg":5,"data":6},0,"success",[7,14,19,24,29,34,39,44,49],{"id":8,"doc_module":9,"doc_module_name":10,"category_name":11,"show_sort_weight":12,"slug":13},11,1,"Template","Presentations",90,"presentations",{"id":15,"doc_module":9,"doc_module_name":10,"category_name":16,"show_sort_weight":17,"slug":18},12,"Resumes",80,"resumes",{"id":20,"doc_module":9,"doc_module_name":10,"category_name":21,"show_sort_weight":22,"slug":23},14,"Invoices",70,"invoices",{"id":25,"doc_module":9,"doc_module_name":10,"category_name":26,"show_sort_weight":27,"slug":28},15,"Posters",60,"posters",{"id":30,"doc_module":9,"doc_module_name":10,"category_name":31,"show_sort_weight":32,"slug":33},16,"Social Media",50,"social-media",{"id":35,"doc_module":9,"doc_module_name":10,"category_name":36,"show_sort_weight":37,"slug":38},17,"Forms",40,"forms",{"id":40,"doc_module":9,"doc_module_name":10,"category_name":41,"show_sort_weight":42,"slug":43},18,"Letters",30,"letters",{"id":45,"doc_module":9,"doc_module_name":10,"category_name":46,"show_sort_weight":47,"slug":48},21,"Paper Templates",5,"papers-templates",{"id":50,"doc_module":9,"doc_module_name":10,"category_name":51,"show_sort_weight":4,"slug":52},158,"General","general-158",{"code":4,"msg":54,"data":55},"ok",{"site_id":56,"language":57,"slug":58,"title":59,"keywords":60,"description":61,"schema_data":62,"social_meta":113,"head_meta":115,"extra_data":117,"updated_unix":119},105,"en","jquery-cheatsheet-selectors-actions","jQuery CheatSheet - Selectors - Actions","","jQuery CheatSheet汇总了常用选择器、事件绑定与触发方式，并提供基础与进阶的DOM操作速查。内容涵盖表单与键鼠事件（如 keydown、submit、change）、文档就绪与 noConflict 用法，以及文本/HTML/表单值读取与设置、属性读写、节点的增删与展示隐藏（hide/show/toggle、fade、slide、animate、stop）。同时列出链式调用、类名管理与DOM遍历（parent/parents/children等）命令。",{"@graph":63,"@context":112},[64,80,95],{"@type":65,"itemListElement":66},"BreadcrumbList",[67,71,74,77],{"item":68,"name":69,"@type":70,"position":9},"https://docshare.wps.com","Home","ListItem",{"item":72,"name":10,"@type":70,"position":73},"https://docshare.wps.com/template/",2,{"item":75,"name":51,"@type":70,"position":76},"https://docshare.wps.com/template/general/",3,{"item":78,"name":59,"@type":70,"position":79},"https://docshare.wps.com/template/jquery-cheatsheet-selectors-actions/573642/",4,{"url":78,"name":59,"@type":81,"author":82,"headline":59,"publisher":85,"fileFormat":88,"inLanguage":57,"description":61,"dateModified":89,"datePublished":89,"encodingFormat":88,"isAccessibleForFree":90,"interactionStatistic":91},"DigitalDocument",{"name":83,"@type":84},"dhado","Person",{"url":68,"name":86,"@type":87},"DocShare","Organization","application/pdf","2026-10-14",true,{"@type":92,"interactionType":93,"userInteractionCount":4},"InteractionCounter",{"@type":94},"ViewAction",{"@type":96,"mainEntity":97},"FAQPage",[98,104,108],{"name":99,"@type":100,"acceptedAnswer":101},"如何用选择器定位页面元素并组合使用？","Question",{"text":102,"@type":103},"用$()传入CSS风格选择器即可定位，例如用$p:first、$(\"p > span\")或$(\"[href]\")筛选目标元素。也可用组合选择器如\"h1, p\"配合removeClass或toggleClass。","Answer",{"name":105,"@type":100,"acceptedAnswer":106},"如何在文档就绪后绑定事件并执行操作？",{"text":107,"@type":103},"可使用$(document).ready(function(){ ... })或简写$(function(){ ... })。在就绪回调中给目标元素绑定点击等事件，例如对#demo进行click后在回调里调用hide或其他DOM/效果方法。",{"name":109,"@type":100,"acceptedAnswer":110},"如何读取或设置元素的文本、HTML与表单值？",{"text":111,"@type":103},"使用$().text()读取文本、$().html()读取或设置HTML、$().val()读取表单值；例如$(\"#demo\").html('Hey \u003Cem>yo\u003C/em>')用于设置包含HTML的内容。","https://schema.org",{"og:url":78,"og:type":114,"og:title":59,"og:site_name":86,"og:description":61},"article",{"robots":116,"canonical":78},"index,follow",{"doc_id":118,"site_id":56},573642,1791943687,{"code":4,"msg":5,"data":121},{"doc_id":118,"user_id":122,"nickname":83,"user_avatar":123,"doc_module":9,"category_id":50,"category_name":51,"doc_title":59,"doc_description":61,"doc_content":124,"file_id":125,"file_url":126,"file_type":127,"file_size":128,"view_count":4,"is_deleted":4,"is_public":9,"is_downloadable":9,"audit_status":9,"page_count":73,"language":129,"language_code":57,"site_id":56,"html_lang":57,"table_of_contents":130,"faqs":131,"seo_title":132,"seo_description":61,"update_tm":119,"read_time":9},5909893218464,"https://ap-avatar.wpscdn.com/davatar_085a072bc5b1113ac321206ff7593b45","jQuery CheatSheet  \nSel ectors  \n\n| $ ( \"*\" ) | // all elements |\n| --- | --- |\n| $ (\"p.demo\") | // \u003Cp> elements with cl |\n| $ (\"p:first\") | // the first \u003Cp> elemen |\n| $ (\"p span\") | // span, descendant of |\n| $ (\"p > span\") | // span, direct child o |\n| $ (\"p + span\") | // span immediately pro |\n| $ (\"p ~ span\") | // strong element proce |\n| $ (\"ul li:first\") | // the first \u003Cli> eleme |\n| $ (\"ul li:first-child\") | // the first \u003Cli> eleme |\n| $ (\"ul li:nth-child(3)\") | // third child |\n| $ (\"[href]\") | // any element with an |\n| $ (\"a[target='_blank']\") | // \u003Ca> elements with a |\n| $ (\"a[target!='_blank']\") | // \u003Ca> elements with a |\n| $ (\":input\") | // all form elements |\n| $ (\":button\") | // \u003Cbutton> and \u003Cinput> |\n| $ (\"tr:even\") | // even \u003Ctr> elements |\n| $ (\"tr:odd\") | // odd \u003Ctr> elements |\n| $ (\"span:parent\") | // element which has ch |\n| $ (\"span:contains('demo')\") | // element conaining th |\n| Actions |  |\n| $(selector).action() |  |\n| $ (this).hide() // the | current element |\n| $ (\"div\").hide() // all | \u003Cdiv> elements |\n| $ ( \" .demo\").hide() // all | elements with class=\"dem |\n| $ (\"\\#demo\").hide() // the\u003Cbr>Events | element with id=\"demo\" |\n| $ ( \" .demo\").click(function(){\u003Cbr>$ (this).hide(200 );\u003Cbr>}); |  |\n| Mouse\u003Cbr>scroll, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, load, resize, scroll, unload, error |  |\n| Keyboard\u003Cbr>keydown, keypress, keyup |  |\n| Form\u003Cbr>submit, change, focus, blur |  |\n| DOM Element\u003Cbr>blur, focus, focusin, focusout, change, select, submit |  |\n| Browser\u003Cbr>load, resize, scroll, unload, error |  |\n| .bind()\u003Cbr>$ (document).ready(function() { // atta\u003Cbr>$ (\"\\#demo\").bind( 'blur' , function(e) {\u003Cbr>//dom event fired\u003Cbr>});\u003Cbr>});\u003Cbr>Effects |  |\n\nBasi cs  \n\n| Include\u003Cbr>Download\u003Cbr>\u003Cscript src=\"[https://code.jquery.com/jquery-lates](https://code.jquery.com/jquery-lates)\u003Cbr>\u003Cscript src=\"[https://ajax.googleapis.com/ajax/lib](https://ajax.googleapis.com/ajax/lib) |\n| --- |\n| Syntax\u003Cbr>$ (document).ready(function(){$ ( \" .demo\").click(function(){\u003Cbr>$ (this).hide(200 );});\u003Cbr>});\u003Cbr>$(function(){\u003Cbr>// Short Document Ready\u003Cbr>}); |\n| Each\u003Cbr>$ ( \" .demo\").each(function() { // pa\u003Cbr>document.write ($(this).text() + \" \\n \" ); // ou }); |\n| Trigger\u003Cbr>$ (\"a\\#mylink\").trigger(\"click\"); // triggers event |\n| noConflict\u003Cbr>var jq = $ .noConflict(); // avoid conf\u003Cbr>jq(document).ready(function(){ jq(\"\\#demo\").text ( \"Hello World!\" );\u003Cbr>});\u003Cbr>DOM Manipulati on |\n\n\n| Content\u003Cbr>$ (\"\\#demo\").text(); // returns te\u003Cbr>$ (\"\\#demo\").html(); // returns co\u003Cbr>$ (\"\\#demo\").val(); // returns fi\u003Cbr>$ (\"\\#demo\").html('Hey \u003Cem>yo\u003C/em>'); // sets HTML |  |  |  |\n| --- | --- | --- | --- |\n| Attributes\u003Cbr>$ (\"\\#link\").attr(\"href\"); // ge\u003Cbr>$(\"\\#link\").attr(\"href\",'[https://htmlg.com](https://htmlg.com) '); // s\u003Cbr>$ (\"\\#link\").attr({\u003Cbr>\"href\" : \"[https://htmlg.com](https://htmlg.com) \", // s\u003Cbr>\"title\" : \"HTML Editor\"});\u003Cbr>$ (\"\\#link\").attr(\"href\" , function(i, origValue){ return origValue + \"/help\" ; // ca\u003Cbr>}); |  |  |  |\n| Add |  |  |  |\n| $ ( \" .demo\").prepend(\"Yo!\" ); | // | adds | conte |\n| $ ( \" .demo\").append(\"\u003Cem>Hey!\u003C/em>\"); | // | adds | conte |\n| $ ( \" .demo\").before(\"Cheers\" ); | // | adds | conte |\n| $ ( \" .demo\").after(\"\u003Cem>Peace\u003C/em>\" ); | // | adds | conte |\n\nRemove  \n$ (\"\\#demo\").remove (); // removes the se  \n$ (\"\\#demo\").empty(); // removes childr  \n$ (\"div\").remove ( \" .cl1, .cl2\"); // removes divs w  \n\n|  |  |  |  |\n| --- | --- | --- | --- |\n| Hide / Show\u003Cbr>$ (\"\\#demo\").hide(); // sets to display: none\u003Cbr>$ (\"\\#demo\").show(200 ); // shows hidden elemnt with $ (\"\\#demo\").toggle(); // toggle between show and\u003Cbr>$ ( \"\\#element\" ).hide( \"slow\" , function() { // hide console.log ( \"Animation complete. \" );\u003Cbr>}); |  |  |  |\n| Fade |  |  |  |\n| fadeIn, fadeOut, fadeToggle, fadeTo |  |  |  |\n| $ (\"\\#demo\").fadeIn(); | // fade in a hi |  |  |\n| $ (\"\\#demo\").fadeOut(300); | // fade out |  |  |\n| $ (\"\\#demo\").fadeToggle(\"slow\"); | // toggle betwe ","cbCaimRAr2HLxyms","https://ap.wps.com/l/cbCaimRAr2HLxyms","pdf",139673,"English","# Selectors\n# Actions\n# Basic\n## Syntax and document ready\n## Each, Trigger, noConflict\n# DOM Manipulation\n## Content, Attributes\n## Add, Remove\n# Effects\n## Hide/Show, Fade, Slide, Animate\n# Classes and Traversing","[{\"question\":\"如何用选择器定位页面元素并组合使用？\",\"answer\":\"用$()传入CSS风格选择器即可定位，例如用$p:first、$(\\\"p \\u003e span\\\")或$(\\\"[href]\\\")筛选目标元素。也可用组合选择器如\\\"h1, p\\\"配合removeClass或toggleClass。\"},{\"question\":\"如何在文档就绪后绑定事件并执行操作？\",\"answer\":\"可使用$(document).ready(function(){ ... })或简写$(function(){ ... })。在就绪回调中给目标元素绑定点击等事件，例如对#demo进行click后在回调里调用hide或其他DOM/效果方法。\"},{\"question\":\"如何读取或设置元素的文本、HTML与表单值？\",\"answer\":\"使用$().text()读取文本、$().html()读取或设置HTML、$().val()读取表单值；例如$(\\\"#demo\\\").html('Hey \\u003cem\\u003eyo\\u003c/em\\u003e')用于设置包含HTML的内容。\"}]","jQuery CheatSheet - Selectors - Actions | PDF"]