CINXE.COM
GitHub - niklak/dom_query: A Flexible Rust Crate for DOM Querying and Manipulation
<!DOCTYPE html> <html lang="en" data-color-mode="auto" data-light-theme="light" data-dark-theme="dark" data-a11y-animated-images="system" data-a11y-link-underlines="true" > <head> <meta charset="utf-8"> <link rel="dns-prefetch" href="https://github.githubassets.com"> <link rel="dns-prefetch" href="https://avatars.githubusercontent.com"> <link rel="dns-prefetch" href="https://github-cloud.s3.amazonaws.com"> <link rel="dns-prefetch" href="https://user-images.githubusercontent.com/"> <link rel="preconnect" href="https://github.githubassets.com" crossorigin> <link rel="preconnect" href="https://avatars.githubusercontent.com"> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/light-74231a1f3bbb.css" /><link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/dark-8a995f0bacd4.css" /><link data-color-theme="dark_dimmed" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_dimmed-f37fb7684b1f.css" /><link data-color-theme="dark_high_contrast" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_high_contrast-9ac301c3ebe5.css" /><link data-color-theme="dark_colorblind" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_colorblind-cd826e8636dc.css" /><link data-color-theme="light_colorblind" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_colorblind-f91b0f603451.css" /><link data-color-theme="light_high_contrast" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_high_contrast-83beb16e0ecf.css" /><link data-color-theme="light_tritanopia" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/light_tritanopia-6e122dab64fc.css" /><link data-color-theme="dark_tritanopia" crossorigin="anonymous" media="all" rel="stylesheet" data-href="https://github.githubassets.com/assets/dark_tritanopia-18119e682df0.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-primitives-225433424a87.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-aaa714e5674d.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/global-7eaba1d4847c.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/github-43ae85d4871b.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/repository-4fce88777fa8.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/code-0210be90f4d3.css" /> <script type="application/json" id="client-env">{"locale":"en","featureFlags":["a11y_quote_reply_fix","copilot_immersive_issue_preview","copilot_new_references_ui","copilot_chat_repo_custom_instructions_preview","copilot_no_floating_button","copilot_topics_as_references","copilot_read_shared_conversation","copilot_duplicate_thread","copilot_buffered_streaming","dotcom_chat_client_side_skills","experimentation_azure_variant_endpoint","failbot_handle_non_errors","fgpat_form_ui_updates","geojson_azure_maps","ghost_pilot_confidence_truncation_25","ghost_pilot_confidence_truncation_40","github_models_o3_mini_streaming","hovercard_accessibility","insert_before_patch","issues_react_remove_placeholders","issues_react_blur_item_picker_on_close","marketing_pages_search_explore_provider","primer_react_css_modules_ga","react_data_router_pull_requests","remove_child_patch","sample_network_conn_type","swp_enterprise_contact_form","site_proxima_australia_update","viewscreen_sandbox","issues_react_create_milestone","issues_react_cache_fix_workaround","lifecycle_label_name_updates","copilot_task_oriented_assistive_prompts","issues_react_assignee_warning","issue_types_prevent_private_type_creation","refresh_image_video_src","react_router_dispose_on_disconnect","turbo_app_id_restore"]}</script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/wp-runtime-529542acf893.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover_js-9da652f58479.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_arianotify-polyfill_ariaNotify-polyfill_js-node_modules_github_mi-3abb8f-46b9f4874d95.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_failbot_failbot_ts-75968cfb5298.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/environment-f04cb2a9fc8c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_primer_behaviors_dist_esm_index_mjs-0dbb79f97f8f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_selector-observer_dist_index_esm_js-f690fd9ae3d5.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_relative-time-element_dist_index_js-62d275b7ddd9.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_text-expander-element_dist_index_js-78748950cb0c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_auto-complete-element_dist_index_js-node_modules_github_catalyst_-8e9f78-a90ac05d2469.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_filter-input-element_dist_index_js-node_modules_github_remote-inp-b5f1d7-a1760ffda83d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_markdown-toolbar-element_dist_index_js-ceef33f593fa.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_file-attachment-element_dist_index_js-node_modules_primer_view-co-c44a69-8c52cf4cd0d3.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/github-elements-394f8eb34f19.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/element-registry-e0a42d158bcc.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_braintree_browser-detection_dist_browser-detection_js-node_modules_githu-2906d7-2a07a295af40.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_lit-html_lit-html_js-be8cb88f481b.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_morphdom_dist_morphdom-e-7c534c-a4a1922eb55f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_turbo_dist_turbo_es2017-esm_js-a03ee12d659a.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_remote-form_dist_index_js-node_modules_delegated-events_dist_inde-893f9f-b6294cf703b7.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_color-convert_index_js-e3180fe3bcb3.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_quote-selection_dist_index_js-node_modules_github_session-resume_-947061-e7a6c4a19f98.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_updatable-content_updatable-content_ts-2a55124d5c52.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_task-list_ts-app_assets_modules_github_sso_ts-ui_packages-900dde-768abe60b1f8.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_sticky-scroll-into-view_ts-3e000c5d31a9.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_ajax-error_ts-app_assets_modules_github_behaviors_include-87a4ae-8be71414579a.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_behaviors_commenting_edit_ts-app_assets_modules_github_behaviors_ht-83c235-e429cff6ceb1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/behaviors-7ebb6421bf22.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_delegated-events_dist_index_js-node_modules_github_catalyst_lib_index_js-f6223d90c7ba.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/notifications-global-01e85cd1be94.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_virtualized-list_es_index_js-node_modules_github_template-parts_lib_index_js-94dc7a2157c1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_remote-form_dist_index_js-node_modules_delegated-events_dist_inde-70450e-4b93df70b903.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/app_assets_modules_github_ref-selector_ts-3e9d848bab5f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/codespaces-c3bcacfe317c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_filter-input-element_dist_index_js-node_modules_github_remote-inp-3eebbd-0763620ad7bf.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_decorators_js-node_modules_delegated-events_di-e161aa-9d41fb1b6c9e.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_file-attachment-element_dist_index_js-node_modules_github_remote--3c9c82-b71ef90fbdc7.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/repositories-7a0dbaa42c57.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_github_catalyst_lib_inde-dbbea9-26cce2010167.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/code-menu-1c0aedc134b1.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/primer-react-e05a7c4c5398.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-core-aaa76995a864.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/react-lib-f1bca44e0926.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/octicons-react-cf2f2ab8dab4.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_emotion_is-prop-valid_dist_emotion-is-prop-valid_esm_js-node_modules_emo-62da9f-2df2f32ec596.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_mini-throttle_dist_index_js-node_modules_stacktrace-parser_dist_s-e7dcdd-9a233856b02c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_oddbird_popover-polyfill_dist_popover-fn_js-55fea94174bf.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/notifications-subscriptions-menu-58a0c58bfee4.js"></script> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.e0c9f0687c56358ed85e.module.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/notifications-subscriptions-menu.1bcff9205c241e99cff2.module.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.e0c9f0687c56358ed85e.module.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/notifications-subscriptions-menu.1bcff9205c241e99cff2.module.css" /> <title>GitHub - niklak/dom_query: A Flexible Rust Crate for DOM Querying and Manipulation</title> <meta name="route-pattern" content="/:user_id/:repository" data-turbo-transient> <meta name="route-controller" content="files" data-turbo-transient> <meta name="route-action" content="disambiguate" data-turbo-transient> <meta name="current-catalog-service-hash" content="f3abb0cc802f3d7b95fc8762b94bdcb13bf39634c40c357301c4aa1d67a256fb"> <meta name="request-id" content="D7FE:2D93B2:7C619:91F4C:67E20E00" data-pjax-transient="true"/><meta name="html-safe-nonce" content="f7e87fbc5f31a051495cb3665c1e42e206ef4b294ffb5f093977fee3b66f4252" data-pjax-transient="true"/><meta name="visitor-payload" content="eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJEN0ZFOjJEOTNCMjo3QzYxOTo5MUY0Qzo2N0UyMEUwMCIsInZpc2l0b3JfaWQiOiI2MjY4Mzc5MzY1Nzk5NzU5MzYwIiwicmVnaW9uX2VkZ2UiOiJzb3V0aGVhc3Rhc2lhIiwicmVnaW9uX3JlbmRlciI6InNvdXRoZWFzdGFzaWEifQ==" data-pjax-transient="true"/><meta name="visitor-hmac" content="caedf2e3290d17de130277f1408ccc3f5125d056f1177c58baf2d8c230f01b86" data-pjax-transient="true"/> <meta name="hovercard-subject-tag" content="repository:734642713" data-turbo-transient> <meta name="github-keyboard-shortcuts" content="repository,copilot" data-turbo-transient="true" /> <meta name="selected-link" value="repo_source" data-turbo-transient> <link rel="assets" href="https://github.githubassets.com/"> <meta name="google-site-verification" content="Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I"> <meta name="octolytics-url" content="https://collector.github.com/github/collect" /> <meta name="analytics-location" content="/<user-name>/<repo-name>" data-turbo-transient="true" /> <meta name="user-login" content=""> <meta name="viewport" content="width=device-width"> <meta name="description" content="A Flexible Rust Crate for DOM Querying and Manipulation - niklak/dom_query"> <link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="GitHub"> <link rel="fluid-icon" href="https://github.com/fluidicon.png" title="GitHub"> <meta property="fb:app_id" content="1401488693436528"> <meta name="apple-itunes-app" content="app-id=1477376905, app-argument=https://github.com/niklak/dom_query" /> <meta name="twitter:image" content="https://opengraph.githubassets.com/9eaa0101ba1227649c109925201f6a38e0601491dacbf38c262b534820aaaeb3/niklak/dom_query" /><meta name="twitter:site" content="@github" /><meta name="twitter:card" content="summary_large_image" /><meta name="twitter:title" content="GitHub - niklak/dom_query: A Flexible Rust Crate for DOM Querying and Manipulation" /><meta name="twitter:description" content="A Flexible Rust Crate for DOM Querying and Manipulation - niklak/dom_query" /> <meta property="og:image" content="https://opengraph.githubassets.com/9eaa0101ba1227649c109925201f6a38e0601491dacbf38c262b534820aaaeb3/niklak/dom_query" /><meta property="og:image:alt" content="A Flexible Rust Crate for DOM Querying and Manipulation - niklak/dom_query" /><meta property="og:image:width" content="1200" /><meta property="og:image:height" content="600" /><meta property="og:site_name" content="GitHub" /><meta property="og:type" content="object" /><meta property="og:title" content="GitHub - niklak/dom_query: A Flexible Rust Crate for DOM Querying and Manipulation" /><meta property="og:url" content="https://github.com/niklak/dom_query" /><meta property="og:description" content="A Flexible Rust Crate for DOM Querying and Manipulation - niklak/dom_query" /> <meta name="hostname" content="github.com"> <meta name="expected-hostname" content="github.com"> <meta http-equiv="x-pjax-version" content="ecee3c2ec9fc2c8474b455888eeaa22bc920ec486bfb48c63dcd5e02a6aa0ad9" data-turbo-track="reload"> <meta http-equiv="x-pjax-csp-version" content="77190eb53eb47fc30bd2fcc17a7eefa2dfd8505869fee9299ba911be3a40a9eb" data-turbo-track="reload"> <meta http-equiv="x-pjax-css-version" content="1994cd18701e16e6efa87d97f308447f5b0f15b7ae2b58d73f3d026c94bd5edd" data-turbo-track="reload"> <meta http-equiv="x-pjax-js-version" content="c3af3e952527b65b7a40bd1ad50393d03bd3e357209ef3248e007f71b47f5cef" data-turbo-track="reload"> <meta name="turbo-cache-control" content="no-preview" data-turbo-transient=""> <meta data-hydrostats="publish"> <meta name="go-import" content="github.com/niklak/dom_query git https://github.com/niklak/dom_query.git"> <meta name="octolytics-dimension-user_id" content="15178803" /><meta name="octolytics-dimension-user_login" content="niklak" /><meta name="octolytics-dimension-repository_id" content="734642713" /><meta name="octolytics-dimension-repository_nwo" content="niklak/dom_query" /><meta name="octolytics-dimension-repository_public" content="true" /><meta name="octolytics-dimension-repository_is_fork" content="false" /><meta name="octolytics-dimension-repository_network_root_id" content="734642713" /><meta name="octolytics-dimension-repository_network_root_nwo" content="niklak/dom_query" /> <link rel="canonical" href="https://github.com/niklak/dom_query" data-turbo-transient> <meta name="turbo-body-classes" content="logged-out env-production page-responsive"> <meta name="browser-stats-url" content="https://api.github.com/_private/browser/stats"> <meta name="browser-errors-url" content="https://api.github.com/_private/browser/errors"> <meta name="release" content="45a734e61ae8d799799de71fe2b404cdefb40b62"> <link rel="mask-icon" href="https://github.githubassets.com/assets/pinned-octocat-093da3e6fa40.svg" color="#000000"> <link rel="alternate icon" class="js-site-favicon" type="image/png" href="https://github.githubassets.com/favicons/favicon.png"> <link rel="icon" class="js-site-favicon" type="image/svg+xml" href="https://github.githubassets.com/favicons/favicon.svg" data-base-href="https://github.githubassets.com/favicons/favicon"> <meta name="theme-color" content="#1e2327"> <meta name="color-scheme" content="light dark" /> <link rel="manifest" href="/manifest.json" crossOrigin="use-credentials"> </head> <body class="logged-out env-production page-responsive" style="word-wrap: break-word;"> <div data-turbo-body class="logged-out env-production page-responsive" style="word-wrap: break-word;"> <div class="position-relative header-wrapper js-header-wrapper "> <a href="#start-of-content" data-skip-target-assigned="false" class="px-2 py-4 color-bg-accent-emphasis color-fg-on-emphasis show-on-focus js-skip-to-content">Skip to content</a> <span data-view-component="true" class="progress-pjax-loader Progress position-fixed width-full"> <span style="width: 0%;" data-view-component="true" class="Progress-item progress-pjax-loader-bar left-0 top-0 color-bg-accent-emphasis"></span> </span> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_ui-commands_ui-commands_ts-8c874fb594e9.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/keyboard-shortcuts-dialog-33dfb803e078.js"></script> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.e0c9f0687c56358ed85e.module.css" /> <react-partial partial-name="keyboard-shortcuts-dialog" data-ssr="false" data-attempted-ssr="false" > <script type="application/json" data-target="react-partial.embeddedData">{"props":{"docsUrl":"https://docs.github.com/get-started/accessibility/keyboard-shortcuts"}}</script> <div data-target="react-partial.reactRoot"></div> </react-partial> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_github_remote-form_dist_index_js-node_modules_delegated-events_dist_inde-94fd67-4898d1bf4b51.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/sessions-730dca81d0a2.js"></script> <header class="HeaderMktg header-logged-out js-details-container js-header Details f4 py-3" role="banner" data-is-top="true" data-color-mode=light data-light-theme=light data-dark-theme=dark> <h2 class="sr-only">Navigation Menu</h2> <button type="button" class="HeaderMktg-backdrop d-lg-none border-0 position-fixed top-0 left-0 width-full height-full js-details-target" aria-label="Toggle navigation"> <span class="d-none">Toggle navigation</span> </button> <div class="d-flex flex-column flex-lg-row flex-items-center px-3 px-md-4 px-lg-5 height-full position-relative z-1"> <div class="d-flex flex-justify-between flex-items-center width-full width-lg-auto"> <div class="flex-1"> <button aria-label="Toggle navigation" aria-expanded="false" type="button" data-view-component="true" class="js-details-target js-nav-padding-recalculate js-header-menu-toggle Button--link Button--medium Button d-lg-none color-fg-inherit p-1"> <span class="Button-content"> <span class="Button-label"><div class="HeaderMenu-toggle-bar rounded my-1"></div> <div class="HeaderMenu-toggle-bar rounded my-1"></div> <div class="HeaderMenu-toggle-bar rounded my-1"></div></span> </span> </button> </div> <a class="mr-lg-3 color-fg-inherit flex-order-2 js-prevent-focus-on-mobile-nav" href="/" aria-label="Homepage" data-analytics-event="{"category":"Marketing nav","action":"click to go to homepage","label":"ref_page:Marketing;ref_cta:Logomark;ref_loc:Header"}"> <svg height="32" aria-hidden="true" viewBox="0 0 24 24" version="1.1" width="32" data-view-component="true" class="octicon octicon-mark-github"> <path d="M12 1C5.9225 1 1 5.9225 1 12C1 16.8675 4.14875 20.9787 8.52125 22.4362C9.07125 22.5325 9.2775 22.2025 9.2775 21.9137C9.2775 21.6525 9.26375 20.7862 9.26375 19.865C6.5 20.3737 5.785 19.1912 5.565 18.5725C5.44125 18.2562 4.905 17.28 4.4375 17.0187C4.0525 16.8125 3.5025 16.3037 4.42375 16.29C5.29 16.2762 5.90875 17.0875 6.115 17.4175C7.105 19.0812 8.68625 18.6137 9.31875 18.325C9.415 17.61 9.70375 17.1287 10.02 16.8537C7.5725 16.5787 5.015 15.63 5.015 11.4225C5.015 10.2262 5.44125 9.23625 6.1425 8.46625C6.0325 8.19125 5.6475 7.06375 6.2525 5.55125C6.2525 5.55125 7.17375 5.2625 9.2775 6.67875C10.1575 6.43125 11.0925 6.3075 12.0275 6.3075C12.9625 6.3075 13.8975 6.43125 14.7775 6.67875C16.8813 5.24875 17.8025 5.55125 17.8025 5.55125C18.4075 7.06375 18.0225 8.19125 17.9125 8.46625C18.6138 9.23625 19.04 10.2125 19.04 11.4225C19.04 15.6437 16.4688 16.5787 14.0213 16.8537C14.42 17.1975 14.7638 17.8575 14.7638 18.8887C14.7638 20.36 14.75 21.5425 14.75 21.9137C14.75 22.2025 14.9563 22.5462 15.5063 22.4362C19.8513 20.9787 23 16.8537 23 12C23 5.9225 18.0775 1 12 1Z"></path> </svg> </a> <div class="flex-1 flex-order-2 text-right"> <a href="/login?return_to=https%3A%2F%2Fgithub.com%2Fniklak%2Fdom_query" class="HeaderMenu-link HeaderMenu-button d-inline-flex d-lg-none flex-order-1 f5 no-underline border color-border-default rounded-2 px-2 py-1 color-fg-inherit js-prevent-focus-on-mobile-nav" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"site header menu","repository_id":null,"auth_type":"SIGN_UP","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="7fa0152bdea4de791d7d131e08c3ad3e3eaa7181b7256ac99cd9e45c41bed6f0" data-analytics-event="{"category":"Marketing nav","action":"click to Sign in","label":"ref_page:Marketing;ref_cta:Sign in;ref_loc:Header"}" > Sign in </a> </div> </div> <div class="HeaderMenu js-header-menu height-fit position-lg-relative d-lg-flex flex-column flex-auto top-0"> <div class="HeaderMenu-wrapper d-flex flex-column flex-self-start flex-lg-row flex-auto rounded rounded-lg-0"> <nav class="HeaderMenu-nav" aria-label="Global"> <ul class="d-lg-flex list-style-none"> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Product <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 d-lg-flex flex-wrap dropdown-menu-wide"> <div class="HeaderMenu-column px-lg-4 border-lg-right mb-4 mb-lg-0 pr-lg-7"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"github_copilot","context":"product","tag":"link","label":"github_copilot_link_product_navbar"}" href="https://github.com/features/copilot"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-copilot color-fg-subtle mr-3"> <path d="M23.922 16.992c-.861 1.495-5.859 5.023-11.922 5.023-6.063 0-11.061-3.528-11.922-5.023A.641.641 0 0 1 0 16.736v-2.869a.841.841 0 0 1 .053-.22c.372-.935 1.347-2.292 2.605-2.656.167-.429.414-1.055.644-1.517a10.195 10.195 0 0 1-.052-1.086c0-1.331.282-2.499 1.132-3.368.397-.406.89-.717 1.474-.952 1.399-1.136 3.392-2.093 6.122-2.093 2.731 0 4.767.957 6.166 2.093.584.235 1.077.546 1.474.952.85.869 1.132 2.037 1.132 3.368 0 .368-.014.733-.052 1.086.23.462.477 1.088.644 1.517 1.258.364 2.233 1.721 2.605 2.656a.832.832 0 0 1 .053.22v2.869a.641.641 0 0 1-.078.256ZM12.172 11h-.344a4.323 4.323 0 0 1-.355.508C10.703 12.455 9.555 13 7.965 13c-1.725 0-2.989-.359-3.782-1.259a2.005 2.005 0 0 1-.085-.104L4 11.741v6.585c1.435.779 4.514 2.179 8 2.179 3.486 0 6.565-1.4 8-2.179v-6.585l-.098-.104s-.033.045-.085.104c-.793.9-2.057 1.259-3.782 1.259-1.59 0-2.738-.545-3.508-1.492a4.323 4.323 0 0 1-.355-.508h-.016.016Zm.641-2.935c.136 1.057.403 1.913.878 2.497.442.544 1.134.938 2.344.938 1.573 0 2.292-.337 2.657-.751.384-.435.558-1.15.558-2.361 0-1.14-.243-1.847-.705-2.319-.477-.488-1.319-.862-2.824-1.025-1.487-.161-2.192.138-2.533.529-.269.307-.437.808-.438 1.578v.021c0 .265.021.562.063.893Zm-1.626 0c.042-.331.063-.628.063-.894v-.02c-.001-.77-.169-1.271-.438-1.578-.341-.391-1.046-.69-2.533-.529-1.505.163-2.347.537-2.824 1.025-.462.472-.705 1.179-.705 2.319 0 1.211.175 1.926.558 2.361.365.414 1.084.751 2.657.751 1.21 0 1.902-.394 2.344-.938.475-.584.742-1.44.878-2.497Z"></path><path d="M14.5 14.25a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Zm-5 0a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Z"></path> </svg> <div> <div class="color-fg-default h4">GitHub Copilot</div> Write better code with AI </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"security","context":"product","tag":"link","label":"security_link_product_navbar"}" href="https://github.com/features/security"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-shield-check color-fg-subtle mr-3"> <path d="M16.53 9.78a.75.75 0 0 0-1.06-1.06L11 13.19l-1.97-1.97a.75.75 0 0 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l5-5Z"></path><path d="m12.54.637 8.25 2.675A1.75 1.75 0 0 1 22 4.976V10c0 6.19-3.771 10.704-9.401 12.83a1.704 1.704 0 0 1-1.198 0C5.77 20.705 2 16.19 2 10V4.976c0-.758.489-1.43 1.21-1.664L11.46.637a1.748 1.748 0 0 1 1.08 0Zm-.617 1.426-8.25 2.676a.249.249 0 0 0-.173.237V10c0 5.46 3.28 9.483 8.43 11.426a.199.199 0 0 0 .14 0C17.22 19.483 20.5 15.461 20.5 10V4.976a.25.25 0 0 0-.173-.237l-8.25-2.676a.253.253 0 0 0-.154 0Z"></path> </svg> <div> <div class="color-fg-default h4">Security</div> Find and fix vulnerabilities </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"actions","context":"product","tag":"link","label":"actions_link_product_navbar"}" href="https://github.com/features/actions"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-workflow color-fg-subtle mr-3"> <path d="M1 3a2 2 0 0 1 2-2h6.5a2 2 0 0 1 2 2v6.5a2 2 0 0 1-2 2H7v4.063C7 16.355 7.644 17 8.438 17H12.5v-2.5a2 2 0 0 1 2-2H21a2 2 0 0 1 2 2V21a2 2 0 0 1-2 2h-6.5a2 2 0 0 1-2-2v-2.5H8.437A2.939 2.939 0 0 1 5.5 15.562V11.5H3a2 2 0 0 1-2-2Zm2-.5a.5.5 0 0 0-.5.5v6.5a.5.5 0 0 0 .5.5h6.5a.5.5 0 0 0 .5-.5V3a.5.5 0 0 0-.5-.5ZM14.5 14a.5.5 0 0 0-.5.5V21a.5.5 0 0 0 .5.5H21a.5.5 0 0 0 .5-.5v-6.5a.5.5 0 0 0-.5-.5Z"></path> </svg> <div> <div class="color-fg-default h4">Actions</div> Automate any workflow </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"codespaces","context":"product","tag":"link","label":"codespaces_link_product_navbar"}" href="https://github.com/features/codespaces"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-codespaces color-fg-subtle mr-3"> <path d="M3.5 3.75C3.5 2.784 4.284 2 5.25 2h13.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 18.75 13H5.25a1.75 1.75 0 0 1-1.75-1.75Zm-2 12c0-.966.784-1.75 1.75-1.75h17.5c.966 0 1.75.784 1.75 1.75v4a1.75 1.75 0 0 1-1.75 1.75H3.25a1.75 1.75 0 0 1-1.75-1.75ZM5.25 3.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h13.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Zm-2 12a.25.25 0 0 0-.25.25v4c0 .138.112.25.25.25h17.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25Z"></path><path d="M10 17.75a.75.75 0 0 1 .75-.75h6.5a.75.75 0 0 1 0 1.5h-6.5a.75.75 0 0 1-.75-.75Zm-4 0a.75.75 0 0 1 .75-.75h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1-.75-.75Z"></path> </svg> <div> <div class="color-fg-default h4">Codespaces</div> Instant dev environments </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"issues","context":"product","tag":"link","label":"issues_link_product_navbar"}" href="https://github.com/features/issues"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-issue-opened color-fg-subtle mr-3"> <path d="M12 1c6.075 0 11 4.925 11 11s-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1ZM2.5 12a9.5 9.5 0 0 0 9.5 9.5 9.5 9.5 0 0 0 9.5-9.5A9.5 9.5 0 0 0 12 2.5 9.5 9.5 0 0 0 2.5 12Zm9.5 2a2 2 0 1 1-.001-3.999A2 2 0 0 1 12 14Z"></path> </svg> <div> <div class="color-fg-default h4">Issues</div> Plan and track work </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"code_review","context":"product","tag":"link","label":"code_review_link_product_navbar"}" href="https://github.com/features/code-review"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-code-review color-fg-subtle mr-3"> <path d="M10.3 6.74a.75.75 0 0 1-.04 1.06l-2.908 2.7 2.908 2.7a.75.75 0 1 1-1.02 1.1l-3.5-3.25a.75.75 0 0 1 0-1.1l3.5-3.25a.75.75 0 0 1 1.06.04Zm3.44 1.06a.75.75 0 1 1 1.02-1.1l3.5 3.25a.75.75 0 0 1 0 1.1l-3.5 3.25a.75.75 0 1 1-1.02-1.1l2.908-2.7-2.908-2.7Z"></path><path d="M1.5 4.25c0-.966.784-1.75 1.75-1.75h17.5c.966 0 1.75.784 1.75 1.75v12.5a1.75 1.75 0 0 1-1.75 1.75h-9.69l-3.573 3.573A1.458 1.458 0 0 1 5 21.043V18.5H3.25a1.75 1.75 0 0 1-1.75-1.75ZM3.25 4a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h2.5a.75.75 0 0 1 .75.75v3.19l3.72-3.72a.749.749 0 0 1 .53-.22h10a.25.25 0 0 0 .25-.25V4.25a.25.25 0 0 0-.25-.25Z"></path> </svg> <div> <div class="color-fg-default h4">Code Review</div> Manage code changes </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"discussions","context":"product","tag":"link","label":"discussions_link_product_navbar"}" href="https://github.com/features/discussions"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-comment-discussion color-fg-subtle mr-3"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 14.25 14H8.061l-2.574 2.573A1.458 1.458 0 0 1 3 15.543V14H1.75A1.75 1.75 0 0 1 0 12.25v-9.5C0 1.784.784 1 1.75 1ZM1.5 2.75v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Z"></path><path d="M22.5 8.75a.25.25 0 0 0-.25-.25h-3.5a.75.75 0 0 1 0-1.5h3.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 22.25 20H21v1.543a1.457 1.457 0 0 1-2.487 1.03L15.939 20H10.75A1.75 1.75 0 0 1 9 18.25v-1.465a.75.75 0 0 1 1.5 0v1.465c0 .138.112.25.25.25h5.5a.75.75 0 0 1 .53.22l2.72 2.72v-2.19a.75.75 0 0 1 .75-.75h2a.25.25 0 0 0 .25-.25v-9.5Z"></path> </svg> <div> <div class="color-fg-default h4">Discussions</div> Collaborate outside of code </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"code_search","context":"product","tag":"link","label":"code_search_link_product_navbar"}" href="https://github.com/features/code-search"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-code-square color-fg-subtle mr-3"> <path d="M10.3 8.24a.75.75 0 0 1-.04 1.06L7.352 12l2.908 2.7a.75.75 0 1 1-1.02 1.1l-3.5-3.25a.75.75 0 0 1 0-1.1l3.5-3.25a.75.75 0 0 1 1.06.04Zm3.44 1.06a.75.75 0 1 1 1.02-1.1l3.5 3.25a.75.75 0 0 1 0 1.1l-3.5 3.25a.75.75 0 1 1-1.02-1.1l2.908-2.7-2.908-2.7Z"></path><path d="M2 3.75C2 2.784 2.784 2 3.75 2h16.5c.966 0 1.75.784 1.75 1.75v16.5A1.75 1.75 0 0 1 20.25 22H3.75A1.75 1.75 0 0 1 2 20.25Zm1.75-.25a.25.25 0 0 0-.25.25v16.5c0 .138.112.25.25.25h16.5a.25.25 0 0 0 .25-.25V3.75a.25.25 0 0 0-.25-.25Z"></path> </svg> <div> <div class="color-fg-default h4">Code Search</div> Find more, search less </div> </a></li> </ul> </div> </div> <div class="HeaderMenu-column px-lg-4"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="product-explore-heading">Explore</span> <ul class="list-style-none f5" aria-labelledby="product-explore-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"all_features","context":"product","tag":"link","label":"all_features_link_product_navbar"}" href="https://github.com/features"> All features </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"documentation","context":"product","tag":"link","label":"documentation_link_product_navbar"}" href="https://docs.github.com"> Documentation <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"github_skills","context":"product","tag":"link","label":"github_skills_link_product_navbar"}" href="https://skills.github.com"> GitHub Skills <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"blog","context":"product","tag":"link","label":"blog_link_product_navbar"}" href="https://github.blog"> Blog <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Solutions <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 d-lg-flex flex-wrap dropdown-menu-wide"> <div class="HeaderMenu-column px-lg-4 border-lg-right mb-4 mb-lg-0 pr-lg-7"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0 pb-lg-3 mb-3 mb-lg-0"> <span class="d-block h4 color-fg-default my-1" id="solutions-by-company-size-heading">By company size</span> <ul class="list-style-none f5" aria-labelledby="solutions-by-company-size-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"enterprises","context":"solutions","tag":"link","label":"enterprises_link_solutions_navbar"}" href="https://github.com/enterprise"> Enterprises </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"small_and_medium_teams","context":"solutions","tag":"link","label":"small_and_medium_teams_link_solutions_navbar"}" href="https://github.com/team"> Small and medium teams </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"startups","context":"solutions","tag":"link","label":"startups_link_solutions_navbar"}" href="https://github.com/enterprise/startups"> Startups </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"nonprofits","context":"solutions","tag":"link","label":"nonprofits_link_solutions_navbar"}" href="/solutions/industry/nonprofits"> Nonprofits </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="solutions-by-use-case-heading">By use case</span> <ul class="list-style-none f5" aria-labelledby="solutions-by-use-case-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"devsecops","context":"solutions","tag":"link","label":"devsecops_link_solutions_navbar"}" href="/solutions/use-case/devsecops"> DevSecOps </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"devops","context":"solutions","tag":"link","label":"devops_link_solutions_navbar"}" href="/solutions/use-case/devops"> DevOps </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"ci_cd","context":"solutions","tag":"link","label":"ci_cd_link_solutions_navbar"}" href="/solutions/use-case/ci-cd"> CI/CD </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"view_all_use_cases","context":"solutions","tag":"link","label":"view_all_use_cases_link_solutions_navbar"}" href="/solutions/use-case"> View all use cases </a></li> </ul> </div> </div> <div class="HeaderMenu-column px-lg-4"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="solutions-by-industry-heading">By industry</span> <ul class="list-style-none f5" aria-labelledby="solutions-by-industry-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"healthcare","context":"solutions","tag":"link","label":"healthcare_link_solutions_navbar"}" href="/solutions/industry/healthcare"> Healthcare </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"financial_services","context":"solutions","tag":"link","label":"financial_services_link_solutions_navbar"}" href="/solutions/industry/financial-services"> Financial services </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"manufacturing","context":"solutions","tag":"link","label":"manufacturing_link_solutions_navbar"}" href="/solutions/industry/manufacturing"> Manufacturing </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"government","context":"solutions","tag":"link","label":"government_link_solutions_navbar"}" href="/solutions/industry/government"> Government </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"view_all_industries","context":"solutions","tag":"link","label":"view_all_industries_link_solutions_navbar"}" href="/solutions/industry"> View all industries </a></li> </ul> </div> </div> <div class="HeaderMenu-trailing-link rounded-bottom-2 flex-shrink-0 mt-lg-4 px-lg-4 py-4 py-lg-3 f5 text-semibold"> <a href="/solutions"> View all solutions <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-right HeaderMenu-trailing-link-icon"> <path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06Z"></path> </svg> </a> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Resources <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 d-lg-flex flex-wrap dropdown-menu-wide"> <div class="HeaderMenu-column px-lg-4 border-lg-right mb-4 mb-lg-0 pr-lg-7"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="resources-topics-heading">Topics</span> <ul class="list-style-none f5" aria-labelledby="resources-topics-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"ai","context":"resources","tag":"link","label":"ai_link_resources_navbar"}" href="/resources/articles/ai"> AI </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"devops","context":"resources","tag":"link","label":"devops_link_resources_navbar"}" href="/resources/articles/devops"> DevOps </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"security","context":"resources","tag":"link","label":"security_link_resources_navbar"}" href="/resources/articles/security"> Security </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"software_development","context":"resources","tag":"link","label":"software_development_link_resources_navbar"}" href="/resources/articles/software-development"> Software Development </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"view_all","context":"resources","tag":"link","label":"view_all_link_resources_navbar"}" href="/resources/articles"> View all </a></li> </ul> </div> </div> <div class="HeaderMenu-column px-lg-4"> <div class="border-bottom pb-3 pb-lg-0 border-lg-bottom-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="resources-explore-heading">Explore</span> <ul class="list-style-none f5" aria-labelledby="resources-explore-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"learning_pathways","context":"resources","tag":"link","label":"learning_pathways_link_resources_navbar"}" href="https://resources.github.com/learn/pathways"> Learning Pathways <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"events_amp_webinars","context":"resources","tag":"link","label":"events_amp_webinars_link_resources_navbar"}" href="https://resources.github.com"> Events & Webinars <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"ebooks_amp_whitepapers","context":"resources","tag":"link","label":"ebooks_amp_whitepapers_link_resources_navbar"}" href="https://github.com/resources/whitepapers"> Ebooks & Whitepapers </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"customer_stories","context":"resources","tag":"link","label":"customer_stories_link_resources_navbar"}" href="https://github.com/customer-stories"> Customer Stories </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary Link--external" target="_blank" data-analytics-event="{"location":"navbar","action":"partners","context":"resources","tag":"link","label":"partners_link_resources_navbar"}" href="https://partner.github.com"> Partners <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link-external HeaderMenu-external-icon color-fg-subtle"> <path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path> </svg> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"executive_insights","context":"resources","tag":"link","label":"executive_insights_link_resources_navbar"}" href="https://github.com/solutions/executive-insights"> Executive Insights </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Open Source <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 px-lg-4"> <div class="HeaderMenu-column"> <div class="border-bottom pb-3 pb-lg-0 pb-lg-3 mb-3 mb-lg-0 mb-lg-3"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"github_sponsors","context":"open_source","tag":"link","label":"github_sponsors_link_open_source_navbar"}" href="/sponsors"> <div> <div class="color-fg-default h4">GitHub Sponsors</div> Fund open source developers </div> </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 pb-lg-3 mb-3 mb-lg-0 mb-lg-3"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"the_readme_project","context":"open_source","tag":"link","label":"the_readme_project_link_open_source_navbar"}" href="https://github.com/readme"> <div> <div class="color-fg-default h4">The ReadME Project</div> GitHub community articles </div> </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="open-source-repositories-heading">Repositories</span> <ul class="list-style-none f5" aria-labelledby="open-source-repositories-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"topics","context":"open_source","tag":"link","label":"topics_link_open_source_navbar"}" href="https://github.com/topics"> Topics </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"trending","context":"open_source","tag":"link","label":"trending_link_open_source_navbar"}" href="https://github.com/trending"> Trending </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary" data-analytics-event="{"location":"navbar","action":"collections","context":"open_source","tag":"link","label":"collections_link_open_source_navbar"}" href="https://github.com/collections"> Collections </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <button type="button" class="HeaderMenu-link border-0 width-full width-lg-auto px-0 px-lg-2 py-lg-2 no-wrap d-flex flex-items-center flex-justify-between js-details-target" aria-expanded="false"> Enterprise <svg opacity="0.5" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-chevron-down HeaderMenu-icon ml-1"> <path d="M12.78 5.22a.749.749 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.06 0L3.22 6.28a.749.749 0 1 1 1.06-1.06L8 8.939l3.72-3.719a.749.749 0 0 1 1.06 0Z"></path> </svg> </button> <div class="HeaderMenu-dropdown dropdown-menu rounded m-0 p-0 pt-2 pt-lg-4 position-relative position-lg-absolute left-0 left-lg-n3 pb-2 pb-lg-4 px-lg-4"> <div class="HeaderMenu-column"> <div class="border-bottom pb-3 pb-lg-0 pb-lg-3 mb-3 mb-lg-0 mb-lg-3"> <ul class="list-style-none f5" > <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"enterprise_platform","context":"enterprise","tag":"link","label":"enterprise_platform_link_enterprise_navbar"}" href="/enterprise"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-stack color-fg-subtle mr-3"> <path d="M11.063 1.456a1.749 1.749 0 0 1 1.874 0l8.383 5.316a1.751 1.751 0 0 1 0 2.956l-8.383 5.316a1.749 1.749 0 0 1-1.874 0L2.68 9.728a1.751 1.751 0 0 1 0-2.956Zm1.071 1.267a.25.25 0 0 0-.268 0L3.483 8.039a.25.25 0 0 0 0 .422l8.383 5.316a.25.25 0 0 0 .268 0l8.383-5.316a.25.25 0 0 0 0-.422Z"></path><path d="M1.867 12.324a.75.75 0 0 1 1.035-.232l8.964 5.685a.25.25 0 0 0 .268 0l8.964-5.685a.75.75 0 0 1 .804 1.267l-8.965 5.685a1.749 1.749 0 0 1-1.874 0l-8.965-5.685a.75.75 0 0 1-.231-1.035Z"></path><path d="M1.867 16.324a.75.75 0 0 1 1.035-.232l8.964 5.685a.25.25 0 0 0 .268 0l8.964-5.685a.75.75 0 0 1 .804 1.267l-8.965 5.685a1.749 1.749 0 0 1-1.874 0l-8.965-5.685a.75.75 0 0 1-.231-1.035Z"></path> </svg> <div> <div class="color-fg-default h4">Enterprise platform</div> AI-powered developer platform </div> </a></li> </ul> </div> <div class="border-bottom pb-3 pb-lg-0 border-bottom-0"> <span class="d-block h4 color-fg-default my-1" id="enterprise-available-add-ons-heading">Available add-ons</span> <ul class="list-style-none f5" aria-labelledby="enterprise-available-add-ons-heading"> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"advanced_security","context":"enterprise","tag":"link","label":"advanced_security_link_enterprise_navbar"}" href="https://github.com/enterprise/advanced-security"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-shield-check color-fg-subtle mr-3"> <path d="M16.53 9.78a.75.75 0 0 0-1.06-1.06L11 13.19l-1.97-1.97a.75.75 0 0 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l5-5Z"></path><path d="m12.54.637 8.25 2.675A1.75 1.75 0 0 1 22 4.976V10c0 6.19-3.771 10.704-9.401 12.83a1.704 1.704 0 0 1-1.198 0C5.77 20.705 2 16.19 2 10V4.976c0-.758.489-1.43 1.21-1.664L11.46.637a1.748 1.748 0 0 1 1.08 0Zm-.617 1.426-8.25 2.676a.249.249 0 0 0-.173.237V10c0 5.46 3.28 9.483 8.43 11.426a.199.199 0 0 0 .14 0C17.22 19.483 20.5 15.461 20.5 10V4.976a.25.25 0 0 0-.173-.237l-8.25-2.676a.253.253 0 0 0-.154 0Z"></path> </svg> <div> <div class="color-fg-default h4">Advanced Security</div> Enterprise-grade security features </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description pb-lg-3" data-analytics-event="{"location":"navbar","action":"copilot_for_business","context":"enterprise","tag":"link","label":"copilot_for_business_link_enterprise_navbar"}" href="/features/copilot/copilot-business"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-copilot color-fg-subtle mr-3"> <path d="M23.922 16.992c-.861 1.495-5.859 5.023-11.922 5.023-6.063 0-11.061-3.528-11.922-5.023A.641.641 0 0 1 0 16.736v-2.869a.841.841 0 0 1 .053-.22c.372-.935 1.347-2.292 2.605-2.656.167-.429.414-1.055.644-1.517a10.195 10.195 0 0 1-.052-1.086c0-1.331.282-2.499 1.132-3.368.397-.406.89-.717 1.474-.952 1.399-1.136 3.392-2.093 6.122-2.093 2.731 0 4.767.957 6.166 2.093.584.235 1.077.546 1.474.952.85.869 1.132 2.037 1.132 3.368 0 .368-.014.733-.052 1.086.23.462.477 1.088.644 1.517 1.258.364 2.233 1.721 2.605 2.656a.832.832 0 0 1 .053.22v2.869a.641.641 0 0 1-.078.256ZM12.172 11h-.344a4.323 4.323 0 0 1-.355.508C10.703 12.455 9.555 13 7.965 13c-1.725 0-2.989-.359-3.782-1.259a2.005 2.005 0 0 1-.085-.104L4 11.741v6.585c1.435.779 4.514 2.179 8 2.179 3.486 0 6.565-1.4 8-2.179v-6.585l-.098-.104s-.033.045-.085.104c-.793.9-2.057 1.259-3.782 1.259-1.59 0-2.738-.545-3.508-1.492a4.323 4.323 0 0 1-.355-.508h-.016.016Zm.641-2.935c.136 1.057.403 1.913.878 2.497.442.544 1.134.938 2.344.938 1.573 0 2.292-.337 2.657-.751.384-.435.558-1.15.558-2.361 0-1.14-.243-1.847-.705-2.319-.477-.488-1.319-.862-2.824-1.025-1.487-.161-2.192.138-2.533.529-.269.307-.437.808-.438 1.578v.021c0 .265.021.562.063.893Zm-1.626 0c.042-.331.063-.628.063-.894v-.02c-.001-.77-.169-1.271-.438-1.578-.341-.391-1.046-.69-2.533-.529-1.505.163-2.347.537-2.824 1.025-.462.472-.705 1.179-.705 2.319 0 1.211.175 1.926.558 2.361.365.414 1.084.751 2.657.751 1.21 0 1.902-.394 2.344-.938.475-.584.742-1.44.878-2.497Z"></path><path d="M14.5 14.25a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Zm-5 0a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1Z"></path> </svg> <div> <div class="color-fg-default h4">Copilot for business</div> Enterprise-grade AI features </div> </a></li> <li> <a class="HeaderMenu-dropdown-link d-block no-underline position-relative py-2 Link--secondary d-flex flex-items-center Link--has-description" data-analytics-event="{"location":"navbar","action":"premium_support","context":"enterprise","tag":"link","label":"premium_support_link_enterprise_navbar"}" href="/premium-support"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-comment-discussion color-fg-subtle mr-3"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 14.25 14H8.061l-2.574 2.573A1.458 1.458 0 0 1 3 15.543V14H1.75A1.75 1.75 0 0 1 0 12.25v-9.5C0 1.784.784 1 1.75 1ZM1.5 2.75v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Z"></path><path d="M22.5 8.75a.25.25 0 0 0-.25-.25h-3.5a.75.75 0 0 1 0-1.5h3.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0 1 22.25 20H21v1.543a1.457 1.457 0 0 1-2.487 1.03L15.939 20H10.75A1.75 1.75 0 0 1 9 18.25v-1.465a.75.75 0 0 1 1.5 0v1.465c0 .138.112.25.25.25h5.5a.75.75 0 0 1 .53.22l2.72 2.72v-2.19a.75.75 0 0 1 .75-.75h2a.25.25 0 0 0 .25-.25v-9.5Z"></path> </svg> <div> <div class="color-fg-default h4">Premium Support</div> Enterprise-grade 24/7 support </div> </a></li> </ul> </div> </div> </div> </li> <li class="HeaderMenu-item position-relative flex-wrap flex-justify-between flex-items-center d-block d-lg-flex flex-lg-nowrap flex-lg-items-center js-details-container js-header-menu-item"> <a class="HeaderMenu-link no-underline px-0 px-lg-2 py-3 py-lg-2 d-block d-lg-inline-block" data-analytics-event="{"location":"navbar","action":"pricing","context":"global","tag":"link","label":"pricing_link_global_navbar"}" href="https://github.com/pricing">Pricing</a> </li> </ul> </nav> <div class="d-flex flex-column flex-lg-row width-full flex-justify-end flex-lg-items-center text-center mt-3 mt-lg-0 text-lg-left ml-lg-3"> <qbsearch-input class="search-input" data-scope="repo:niklak/dom_query" data-custom-scopes-path="/search/custom_scopes" data-delete-custom-scopes-csrf="OELjlHF3flV0yp_xW0BWNQRJsbTr0le5wHvN6yCCfPTovL45vFIrV4Bxem8p5JnlTTUd3vR5Xie5VCLvGe7f1w" data-max-custom-scopes="10" data-header-redesign-enabled="false" data-initial-value="" data-blackbird-suggestions-path="/search/suggestions" data-jump-to-suggestions-path="/_graphql/GetSuggestedNavigationDestinations" data-current-repository="niklak/dom_query" data-current-org="" data-current-owner="niklak" data-logged-in="false" data-copilot-chat-enabled="false" data-nl-search-enabled="false" data-retain-scroll-position="true"> <div class="search-input-container search-with-dialog position-relative d-flex flex-row flex-items-center mr-4 rounded" data-action="click:qbsearch-input#searchInputContainerClicked" > <button type="button" class="header-search-button placeholder input-button form-control d-flex flex-1 flex-self-stretch flex-items-center no-wrap width-full py-0 pl-2 pr-0 text-left border-0 box-shadow-none" data-target="qbsearch-input.inputButton" aria-label="Search or jump to…" aria-haspopup="dialog" placeholder="Search or jump to..." data-hotkey=s,/ autocapitalize="off" data-analytics-event="{"location":"navbar","action":"searchbar","context":"global","tag":"input","label":"searchbar_input_global_navbar"}" data-action="click:qbsearch-input#handleExpand" > <div class="mr-2 color-fg-muted"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </div> <span class="flex-1" data-target="qbsearch-input.inputButtonText">Search or jump to...</span> <div class="d-flex" data-target="qbsearch-input.hotkeyIndicator"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="20" aria-hidden="true" class="mr-1"><path fill="none" stroke="#979A9C" opacity=".4" d="M3.5.5h12c1.7 0 3 1.3 3 3v13c0 1.7-1.3 3-3 3h-12c-1.7 0-3-1.3-3-3v-13c0-1.7 1.3-3 3-3z"></path><path fill="#979A9C" d="M11.8 6L8 15.1h-.9L10.8 6h1z"></path></svg> </div> </button> <input type="hidden" name="type" class="js-site-search-type-field"> <div class="Overlay--hidden " data-modal-dialog-overlay> <modal-dialog data-action="close:qbsearch-input#handleClose cancel:qbsearch-input#handleClose" data-target="qbsearch-input.searchSuggestionsDialog" role="dialog" id="search-suggestions-dialog" aria-modal="true" aria-labelledby="search-suggestions-dialog-header" data-view-component="true" class="Overlay Overlay--width-large Overlay--height-auto"> <h1 id="search-suggestions-dialog-header" class="sr-only">Search code, repositories, users, issues, pull requests...</h1> <div class="Overlay-body Overlay-body--paddingNone"> <div data-view-component="true"> <div class="search-suggestions position-fixed width-full color-shadow-large border color-fg-default color-bg-default overflow-hidden d-flex flex-column query-builder-container" style="border-radius: 12px;" data-target="qbsearch-input.queryBuilderContainer" hidden > <!-- '"` --><!-- </textarea></xmp> --></option></form><form id="query-builder-test-form" action="" accept-charset="UTF-8" method="get"> <query-builder data-target="qbsearch-input.queryBuilder" id="query-builder-query-builder-test" data-filter-key=":" data-view-component="true" class="QueryBuilder search-query-builder"> <div class="FormControl FormControl--fullWidth"> <label id="query-builder-test-label" for="query-builder-test" class="FormControl-label sr-only"> Search </label> <div class="QueryBuilder-StyledInput width-fit " data-target="query-builder.styledInput" > <span id="query-builder-test-leadingvisual-wrap" class="FormControl-input-leadingVisualWrap QueryBuilder-leadingVisualWrap"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search FormControl-input-leadingVisual"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </span> <div data-target="query-builder.styledInputContainer" class="QueryBuilder-StyledInputContainer"> <div aria-hidden="true" class="QueryBuilder-StyledInputContent" data-target="query-builder.styledInputContent" ></div> <div class="QueryBuilder-InputWrapper"> <div aria-hidden="true" class="QueryBuilder-Sizer" data-target="query-builder.sizer"></div> <input id="query-builder-test" name="query-builder-test" value="" autocomplete="off" type="text" role="combobox" spellcheck="false" aria-expanded="false" aria-describedby="validation-59b5c55d-c25e-4570-9498-067fa0b35de5" data-target="query-builder.input" data-action=" input:query-builder#inputChange blur:query-builder#inputBlur keydown:query-builder#inputKeydown focus:query-builder#inputFocus " data-view-component="true" class="FormControl-input QueryBuilder-Input FormControl-medium" /> </div> </div> <span class="sr-only" id="query-builder-test-clear">Clear</span> <button role="button" id="query-builder-test-clear-button" aria-labelledby="query-builder-test-clear query-builder-test-label" data-target="query-builder.clearButton" data-action=" click:query-builder#clear focus:query-builder#clearButtonFocus blur:query-builder#clearButtonBlur " variant="small" hidden="hidden" type="button" data-view-component="true" class="Button Button--iconOnly Button--invisible Button--medium mr-1 px-2 py-0 d-flex flex-items-center rounded-1 color-fg-muted"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x-circle-fill Button-visual"> <path d="M2.343 13.657A8 8 0 1 1 13.658 2.343 8 8 0 0 1 2.343 13.657ZM6.03 4.97a.751.751 0 0 0-1.042.018.751.751 0 0 0-.018 1.042L6.94 8 4.97 9.97a.749.749 0 0 0 .326 1.275.749.749 0 0 0 .734-.215L8 9.06l1.97 1.97a.749.749 0 0 0 1.275-.326.749.749 0 0 0-.215-.734L9.06 8l1.97-1.97a.749.749 0 0 0-.326-1.275.749.749 0 0 0-.734.215L8 6.94Z"></path> </svg> </button> </div> <template id="search-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-search"> <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path> </svg> </template> <template id="code-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> </template> <template id="file-code-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-file-code"> <path d="M4 1.75C4 .784 4.784 0 5.75 0h5.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v8.586A1.75 1.75 0 0 1 14.25 15h-9a.75.75 0 0 1 0-1.5h9a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 10 4.25V1.5H5.75a.25.25 0 0 0-.25.25v2.5a.75.75 0 0 1-1.5 0Zm1.72 4.97a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734l1.47-1.47-1.47-1.47a.75.75 0 0 1 0-1.06ZM3.28 7.78 1.81 9.25l1.47 1.47a.751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018l-2-2a.75.75 0 0 1 0-1.06l2-2a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Zm8.22-6.218V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path> </svg> </template> <template id="history-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-history"> <path d="m.427 1.927 1.215 1.215a8.002 8.002 0 1 1-1.6 5.685.75.75 0 1 1 1.493-.154 6.5 6.5 0 1 0 1.18-4.458l1.358 1.358A.25.25 0 0 1 3.896 6H.25A.25.25 0 0 1 0 5.75V2.104a.25.25 0 0 1 .427-.177ZM7.75 4a.75.75 0 0 1 .75.75v2.992l2.028.812a.75.75 0 0 1-.557 1.392l-2.5-1A.751.751 0 0 1 7 8.25v-3.5A.75.75 0 0 1 7.75 4Z"></path> </svg> </template> <template id="repo-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo"> <path d="M2 2.5A2.5 2.5 0 0 1 4.5 0h8.75a.75.75 0 0 1 .75.75v12.5a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1 0-1.5h1.75v-2h-8a1 1 0 0 0-.714 1.7.75.75 0 1 1-1.072 1.05A2.495 2.495 0 0 1 2 11.5Zm10.5-1h-8a1 1 0 0 0-1 1v6.708A2.486 2.486 0 0 1 4.5 9h8ZM5 12.25a.25.25 0 0 1 .25-.25h3.5a.25.25 0 0 1 .25.25v3.25a.25.25 0 0 1-.4.2l-1.45-1.087a.249.249 0 0 0-.3 0L5.4 15.7a.25.25 0 0 1-.4-.2Z"></path> </svg> </template> <template id="bookmark-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-bookmark"> <path d="M3 2.75C3 1.784 3.784 1 4.75 1h6.5c.966 0 1.75.784 1.75 1.75v11.5a.75.75 0 0 1-1.227.579L8 11.722l-3.773 3.107A.751.751 0 0 1 3 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v9.91l3.023-2.489a.75.75 0 0 1 .954 0l3.023 2.49V2.75a.25.25 0 0 0-.25-.25Z"></path> </svg> </template> <template id="plus-circle-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-plus-circle"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm7.25-3.25v2.5h2.5a.75.75 0 0 1 0 1.5h-2.5v2.5a.75.75 0 0 1-1.5 0v-2.5h-2.5a.75.75 0 0 1 0-1.5h2.5v-2.5a.75.75 0 0 1 1.5 0Z"></path> </svg> </template> <template id="circle-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-dot-fill"> <path d="M8 4a4 4 0 1 1 0 8 4 4 0 0 1 0-8Z"></path> </svg> </template> <template id="trash-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-trash"> <path d="M11 1.75V3h2.25a.75.75 0 0 1 0 1.5H2.75a.75.75 0 0 1 0-1.5H5V1.75C5 .784 5.784 0 6.75 0h2.5C10.216 0 11 .784 11 1.75ZM4.496 6.675l.66 6.6a.25.25 0 0 0 .249.225h5.19a.25.25 0 0 0 .249-.225l.66-6.6a.75.75 0 0 1 1.492.149l-.66 6.6A1.748 1.748 0 0 1 10.595 15h-5.19a1.75 1.75 0 0 1-1.741-1.575l-.66-6.6a.75.75 0 1 1 1.492-.15ZM6.5 1.75V3h3V1.75a.25.25 0 0 0-.25-.25h-2.5a.25.25 0 0 0-.25.25Z"></path> </svg> </template> <template id="team-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-people"> <path d="M2 5.5a3.5 3.5 0 1 1 5.898 2.549 5.508 5.508 0 0 1 3.034 4.084.75.75 0 1 1-1.482.235 4 4 0 0 0-7.9 0 .75.75 0 0 1-1.482-.236A5.507 5.507 0 0 1 3.102 8.05 3.493 3.493 0 0 1 2 5.5ZM11 4a3.001 3.001 0 0 1 2.22 5.018 5.01 5.01 0 0 1 2.56 3.012.749.749 0 0 1-.885.954.752.752 0 0 1-.549-.514 3.507 3.507 0 0 0-2.522-2.372.75.75 0 0 1-.574-.73v-.352a.75.75 0 0 1 .416-.672A1.5 1.5 0 0 0 11 5.5.75.75 0 0 1 11 4Zm-5.5-.5a2 2 0 1 0-.001 3.999A2 2 0 0 0 5.5 3.5Z"></path> </svg> </template> <template id="project-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-project"> <path d="M1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25V1.75C0 .784.784 0 1.75 0ZM1.5 1.75v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25ZM11.75 3a.75.75 0 0 1 .75.75v7.5a.75.75 0 0 1-1.5 0v-7.5a.75.75 0 0 1 .75-.75Zm-8.25.75a.75.75 0 0 1 1.5 0v5.5a.75.75 0 0 1-1.5 0ZM8 3a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 3Z"></path> </svg> </template> <template id="pencil-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-pencil"> <path d="M11.013 1.427a1.75 1.75 0 0 1 2.474 0l1.086 1.086a1.75 1.75 0 0 1 0 2.474l-8.61 8.61c-.21.21-.47.364-.756.445l-3.251.93a.75.75 0 0 1-.927-.928l.929-3.25c.081-.286.235-.547.445-.758l8.61-8.61Zm.176 4.823L9.75 4.81l-6.286 6.287a.253.253 0 0 0-.064.108l-.558 1.953 1.953-.558a.253.253 0 0 0 .108-.064Zm1.238-3.763a.25.25 0 0 0-.354 0L10.811 3.75l1.439 1.44 1.263-1.263a.25.25 0 0 0 0-.354Z"></path> </svg> </template> <template id="copilot-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copilot"> <path d="M7.998 15.035c-4.562 0-7.873-2.914-7.998-3.749V9.338c.085-.628.677-1.686 1.588-2.065.013-.07.024-.143.036-.218.029-.183.06-.384.126-.612-.201-.508-.254-1.084-.254-1.656 0-.87.128-1.769.693-2.484.579-.733 1.494-1.124 2.724-1.261 1.206-.134 2.262.034 2.944.765.05.053.096.108.139.165.044-.057.094-.112.143-.165.682-.731 1.738-.899 2.944-.765 1.23.137 2.145.528 2.724 1.261.566.715.693 1.614.693 2.484 0 .572-.053 1.148-.254 1.656.066.228.098.429.126.612.012.076.024.148.037.218.924.385 1.522 1.471 1.591 2.095v1.872c0 .766-3.351 3.795-8.002 3.795Zm0-1.485c2.28 0 4.584-1.11 5.002-1.433V7.862l-.023-.116c-.49.21-1.075.291-1.727.291-1.146 0-2.059-.327-2.71-.991A3.222 3.222 0 0 1 8 6.303a3.24 3.24 0 0 1-.544.743c-.65.664-1.563.991-2.71.991-.652 0-1.236-.081-1.727-.291l-.023.116v4.255c.419.323 2.722 1.433 5.002 1.433ZM6.762 2.83c-.193-.206-.637-.413-1.682-.297-1.019.113-1.479.404-1.713.7-.247.312-.369.789-.369 1.554 0 .793.129 1.171.308 1.371.162.181.519.379 1.442.379.853 0 1.339-.235 1.638-.54.315-.322.527-.827.617-1.553.117-.935-.037-1.395-.241-1.614Zm4.155-.297c-1.044-.116-1.488.091-1.681.297-.204.219-.359.679-.242 1.614.091.726.303 1.231.618 1.553.299.305.784.54 1.638.54.922 0 1.28-.198 1.442-.379.179-.2.308-.578.308-1.371 0-.765-.123-1.242-.37-1.554-.233-.296-.693-.587-1.713-.7Z"></path><path d="M6.25 9.037a.75.75 0 0 1 .75.75v1.501a.75.75 0 0 1-1.5 0V9.787a.75.75 0 0 1 .75-.75Zm4.25.75v1.501a.75.75 0 0 1-1.5 0V9.787a.75.75 0 0 1 1.5 0Z"></path> </svg> </template> <template id="copilot-error-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copilot-error"> <path d="M16 11.24c0 .112-.072.274-.21.467L13 9.688V7.862l-.023-.116c-.49.21-1.075.291-1.727.291-.198 0-.388-.009-.571-.029L6.833 5.226a4.01 4.01 0 0 0 .17-.782c.117-.935-.037-1.395-.241-1.614-.193-.206-.637-.413-1.682-.297-.683.076-1.115.231-1.395.415l-1.257-.91c.579-.564 1.413-.877 2.485-.996 1.206-.134 2.262.034 2.944.765.05.053.096.108.139.165.044-.057.094-.112.143-.165.682-.731 1.738-.899 2.944-.765 1.23.137 2.145.528 2.724 1.261.566.715.693 1.614.693 2.484 0 .572-.053 1.148-.254 1.656.066.228.098.429.126.612.012.076.024.148.037.218.924.385 1.522 1.471 1.591 2.095Zm-5.083-8.707c-1.044-.116-1.488.091-1.681.297-.204.219-.359.679-.242 1.614.091.726.303 1.231.618 1.553.299.305.784.54 1.638.54.922 0 1.28-.198 1.442-.379.179-.2.308-.578.308-1.371 0-.765-.123-1.242-.37-1.554-.233-.296-.693-.587-1.713-.7Zm2.511 11.074c-1.393.776-3.272 1.428-5.43 1.428-4.562 0-7.873-2.914-7.998-3.749V9.338c.085-.628.677-1.686 1.588-2.065.013-.07.024-.143.036-.218.029-.183.06-.384.126-.612-.18-.455-.241-.963-.252-1.475L.31 4.107A.747.747 0 0 1 0 3.509V3.49a.748.748 0 0 1 .625-.73c.156-.026.306.047.435.139l14.667 10.578a.592.592 0 0 1 .227.264.752.752 0 0 1 .046.249v.022a.75.75 0 0 1-1.19.596Zm-1.367-.991L5.635 7.964a5.128 5.128 0 0 1-.889.073c-.652 0-1.236-.081-1.727-.291l-.023.116v4.255c.419.323 2.722 1.433 5.002 1.433 1.539 0 3.089-.505 4.063-.934Z"></path> </svg> </template> <template id="workflow-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-workflow"> <path d="M0 1.75C0 .784.784 0 1.75 0h3.5C6.216 0 7 .784 7 1.75v3.5A1.75 1.75 0 0 1 5.25 7H4v4a1 1 0 0 0 1 1h4v-1.25C9 9.784 9.784 9 10.75 9h3.5c.966 0 1.75.784 1.75 1.75v3.5A1.75 1.75 0 0 1 14.25 16h-3.5A1.75 1.75 0 0 1 9 14.25v-.75H5A2.5 2.5 0 0 1 2.5 11V7h-.75A1.75 1.75 0 0 1 0 5.25Zm1.75-.25a.25.25 0 0 0-.25.25v3.5c0 .138.112.25.25.25h3.5a.25.25 0 0 0 .25-.25v-3.5a.25.25 0 0 0-.25-.25Zm9 9a.25.25 0 0 0-.25.25v3.5c0 .138.112.25.25.25h3.5a.25.25 0 0 0 .25-.25v-3.5a.25.25 0 0 0-.25-.25Z"></path> </svg> </template> <template id="book-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> </template> <template id="code-review-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code-review"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v8.5A1.75 1.75 0 0 1 14.25 13H8.061l-2.574 2.573A1.458 1.458 0 0 1 3 14.543V13H1.75A1.75 1.75 0 0 1 0 11.25v-8.5C0 1.784.784 1 1.75 1ZM1.5 2.75v8.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-8.5a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Zm5.28 1.72a.75.75 0 0 1 0 1.06L5.31 7l1.47 1.47a.751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018l-2-2a.75.75 0 0 1 0-1.06l2-2a.75.75 0 0 1 1.06 0Zm2.44 0a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L10.69 7 9.22 5.53a.75.75 0 0 1 0-1.06Z"></path> </svg> </template> <template id="codespaces-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-codespaces"> <path d="M0 11.25c0-.966.784-1.75 1.75-1.75h12.5c.966 0 1.75.784 1.75 1.75v3A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25Zm2-9.5C2 .784 2.784 0 3.75 0h8.5C13.216 0 14 .784 14 1.75v5a1.75 1.75 0 0 1-1.75 1.75h-8.5A1.75 1.75 0 0 1 2 6.75Zm1.75-.25a.25.25 0 0 0-.25.25v5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-5a.25.25 0 0 0-.25-.25Zm-2 9.5a.25.25 0 0 0-.25.25v3c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-3a.25.25 0 0 0-.25-.25Z"></path><path d="M7 12.75a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1-.75-.75Zm-4 0a.75.75 0 0 1 .75-.75h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1-.75-.75Z"></path> </svg> </template> <template id="comment-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-comment"> <path d="M1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 13.25 12H9.06l-2.573 2.573A1.458 1.458 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> </template> <template id="comment-discussion-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-comment-discussion"> <path d="M1.75 1h8.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 10.25 10H7.061l-2.574 2.573A1.458 1.458 0 0 1 2 11.543V10h-.25A1.75 1.75 0 0 1 0 8.25v-5.5C0 1.784.784 1 1.75 1ZM1.5 2.75v5.5c0 .138.112.25.25.25h1a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h3.5a.25.25 0 0 0 .25-.25v-5.5a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13 2a.25.25 0 0 0-.25-.25h-.5a.75.75 0 0 1 0-1.5h.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 14.25 12H14v1.543a1.458 1.458 0 0 1-2.487 1.03L9.22 12.28a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l2.22 2.22v-2.19a.75.75 0 0 1 .75-.75h1a.25.25 0 0 0 .25-.25Z"></path> </svg> </template> <template id="organization-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-organization"> <path d="M1.75 16A1.75 1.75 0 0 1 0 14.25V1.75C0 .784.784 0 1.75 0h8.5C11.216 0 12 .784 12 1.75v12.5c0 .085-.006.168-.018.25h2.268a.25.25 0 0 0 .25-.25V8.285a.25.25 0 0 0-.111-.208l-1.055-.703a.749.749 0 1 1 .832-1.248l1.055.703c.487.325.779.871.779 1.456v5.965A1.75 1.75 0 0 1 14.25 16h-3.5a.766.766 0 0 1-.197-.026c-.099.017-.2.026-.303.026h-3a.75.75 0 0 1-.75-.75V14h-1v1.25a.75.75 0 0 1-.75.75Zm-.25-1.75c0 .138.112.25.25.25H4v-1.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 .75.75v1.25h2.25a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25ZM3.75 6h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5ZM3 3.75A.75.75 0 0 1 3.75 3h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 3.75Zm4 3A.75.75 0 0 1 7.75 6h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 7 6.75ZM7.75 3h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5ZM3 9.75A.75.75 0 0 1 3.75 9h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 9.75ZM7.75 9h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5Z"></path> </svg> </template> <template id="rocket-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-rocket"> <path d="M14.064 0h.186C15.216 0 16 .784 16 1.75v.186a8.752 8.752 0 0 1-2.564 6.186l-.458.459c-.314.314-.641.616-.979.904v3.207c0 .608-.315 1.172-.833 1.49l-2.774 1.707a.749.749 0 0 1-1.11-.418l-.954-3.102a1.214 1.214 0 0 1-.145-.125L3.754 9.816a1.218 1.218 0 0 1-.124-.145L.528 8.717a.749.749 0 0 1-.418-1.11l1.71-2.774A1.748 1.748 0 0 1 3.31 4h3.204c.288-.338.59-.665.904-.979l.459-.458A8.749 8.749 0 0 1 14.064 0ZM8.938 3.623h-.002l-.458.458c-.76.76-1.437 1.598-2.02 2.5l-1.5 2.317 2.143 2.143 2.317-1.5c.902-.583 1.74-1.26 2.499-2.02l.459-.458a7.25 7.25 0 0 0 2.123-5.127V1.75a.25.25 0 0 0-.25-.25h-.186a7.249 7.249 0 0 0-5.125 2.123ZM3.56 14.56c-.732.732-2.334 1.045-3.005 1.148a.234.234 0 0 1-.201-.064.234.234 0 0 1-.064-.201c.103-.671.416-2.273 1.15-3.003a1.502 1.502 0 1 1 2.12 2.12Zm6.94-3.935c-.088.06-.177.118-.266.175l-2.35 1.521.548 1.783 1.949-1.2a.25.25 0 0 0 .119-.213ZM3.678 8.116 5.2 5.766c.058-.09.117-.178.176-.266H3.309a.25.25 0 0 0-.213.119l-1.2 1.95ZM12 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </template> <template id="shield-check-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-shield-check"> <path d="m8.533.133 5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667l5.25-1.68a1.748 1.748 0 0 1 1.066 0Zm-.61 1.429.001.001-5.25 1.68a.251.251 0 0 0-.174.237V7c0 1.36.275 2.666 1.057 3.859.784 1.194 2.121 2.342 4.366 3.298a.196.196 0 0 0 .154 0c2.245-.957 3.582-2.103 4.366-3.297C13.225 9.666 13.5 8.358 13.5 7V3.48a.25.25 0 0 0-.174-.238l-5.25-1.68a.25.25 0 0 0-.153 0ZM11.28 6.28l-3.5 3.5a.75.75 0 0 1-1.06 0l-1.5-1.5a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l.97.97 2.97-2.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </template> <template id="heart-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-heart"> <path d="m8 14.25.345.666a.75.75 0 0 1-.69 0l-.008-.004-.018-.01a7.152 7.152 0 0 1-.31-.17 22.055 22.055 0 0 1-3.434-2.414C2.045 10.731 0 8.35 0 5.5 0 2.836 2.086 1 4.25 1 5.797 1 7.153 1.802 8 3.02 8.847 1.802 10.203 1 11.75 1 13.914 1 16 2.836 16 5.5c0 2.85-2.045 5.231-3.885 6.818a22.066 22.066 0 0 1-3.744 2.584l-.018.01-.006.003h-.002ZM4.25 2.5c-1.336 0-2.75 1.164-2.75 3 0 2.15 1.58 4.144 3.365 5.682A20.58 20.58 0 0 0 8 13.393a20.58 20.58 0 0 0 3.135-2.211C12.92 9.644 14.5 7.65 14.5 5.5c0-1.836-1.414-3-2.75-3-1.373 0-2.609.986-3.029 2.456a.749.749 0 0 1-1.442 0C6.859 3.486 5.623 2.5 4.25 2.5Z"></path> </svg> </template> <template id="server-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-server"> <path d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v4c0 .372-.116.717-.314 1 .198.283.314.628.314 1v4a1.75 1.75 0 0 1-1.75 1.75H1.75A1.75 1.75 0 0 1 0 12.75v-4c0-.358.109-.707.314-1a1.739 1.739 0 0 1-.314-1v-4C0 1.784.784 1 1.75 1ZM1.5 2.75v4c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Zm.25 5.75a.25.25 0 0 0-.25.25v4c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25ZM7 4.75A.75.75 0 0 1 7.75 4h4.5a.75.75 0 0 1 0 1.5h-4.5A.75.75 0 0 1 7 4.75ZM7.75 10h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM3 4.75A.75.75 0 0 1 3.75 4h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 4.75ZM3.75 10h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5Z"></path> </svg> </template> <template id="globe-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-globe"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM5.78 8.75a9.64 9.64 0 0 0 1.363 4.177c.255.426.542.832.857 1.215.245-.296.551-.705.857-1.215A9.64 9.64 0 0 0 10.22 8.75Zm4.44-1.5a9.64 9.64 0 0 0-1.363-4.177c-.307-.51-.612-.919-.857-1.215a9.927 9.927 0 0 0-.857 1.215A9.64 9.64 0 0 0 5.78 7.25Zm-5.944 1.5H1.543a6.507 6.507 0 0 0 4.666 5.5c-.123-.181-.24-.365-.352-.552-.715-1.192-1.437-2.874-1.581-4.948Zm-2.733-1.5h2.733c.144-2.074.866-3.756 1.58-4.948.12-.197.237-.381.353-.552a6.507 6.507 0 0 0-4.666 5.5Zm10.181 1.5c-.144 2.074-.866 3.756-1.58 4.948-.12.197-.237.381-.353.552a6.507 6.507 0 0 0 4.666-5.5Zm2.733-1.5a6.507 6.507 0 0 0-4.666-5.5c.123.181.24.365.353.552.714 1.192 1.436 2.874 1.58 4.948Z"></path> </svg> </template> <template id="issue-opened-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-issue-opened"> <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path> </svg> </template> <template id="device-mobile-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-device-mobile"> <path d="M3.75 0h8.5C13.216 0 14 .784 14 1.75v12.5A1.75 1.75 0 0 1 12.25 16h-8.5A1.75 1.75 0 0 1 2 14.25V1.75C2 .784 2.784 0 3.75 0ZM3.5 1.75v12.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25ZM8 13a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path> </svg> </template> <template id="package-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-package"> <path d="m8.878.392 5.25 3.045c.54.314.872.89.872 1.514v6.098a1.75 1.75 0 0 1-.872 1.514l-5.25 3.045a1.75 1.75 0 0 1-1.756 0l-5.25-3.045A1.75 1.75 0 0 1 1 11.049V4.951c0-.624.332-1.201.872-1.514L7.122.392a1.75 1.75 0 0 1 1.756 0ZM7.875 1.69l-4.63 2.685L8 7.133l4.755-2.758-4.63-2.685a.248.248 0 0 0-.25 0ZM2.5 5.677v5.372c0 .09.047.171.125.216l4.625 2.683V8.432Zm6.25 8.271 4.625-2.683a.25.25 0 0 0 .125-.216V5.677L8.75 8.432Z"></path> </svg> </template> <template id="credit-card-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-credit-card"> <path d="M10.75 9a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5h-1.5Z"></path><path d="M0 3.75C0 2.784.784 2 1.75 2h12.5c.966 0 1.75.784 1.75 1.75v8.5A1.75 1.75 0 0 1 14.25 14H1.75A1.75 1.75 0 0 1 0 12.25ZM14.5 6.5h-13v5.75c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25Zm0-2.75a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25V5h13Z"></path> </svg> </template> <template id="play-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-play"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z"></path> </svg> </template> <template id="gift-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-gift"> <path d="M2 2.75A2.75 2.75 0 0 1 4.75 0c.983 0 1.873.42 2.57 1.232.268.318.497.668.68 1.042.183-.375.411-.725.68-1.044C9.376.42 10.266 0 11.25 0a2.75 2.75 0 0 1 2.45 4h.55c.966 0 1.75.784 1.75 1.75v2c0 .698-.409 1.301-1 1.582v4.918A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25V9.332C.409 9.05 0 8.448 0 7.75v-2C0 4.784.784 4 1.75 4h.55c-.192-.375-.3-.8-.3-1.25ZM7.25 9.5H2.5v4.75c0 .138.112.25.25.25h4.5Zm1.5 0v5h4.5a.25.25 0 0 0 .25-.25V9.5Zm0-4V8h5.5a.25.25 0 0 0 .25-.25v-2a.25.25 0 0 0-.25-.25Zm-7 0a.25.25 0 0 0-.25.25v2c0 .138.112.25.25.25h5.5V5.5h-5.5Zm3-4a1.25 1.25 0 0 0 0 2.5h2.309c-.233-.818-.542-1.401-.878-1.793-.43-.502-.915-.707-1.431-.707ZM8.941 4h2.309a1.25 1.25 0 0 0 0-2.5c-.516 0-1 .205-1.43.707-.337.392-.646.975-.879 1.793Z"></path> </svg> </template> <template id="code-square-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code-square"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V1.75a.25.25 0 0 0-.25-.25Zm7.47 3.97a.75.75 0 0 1 1.06 0l2 2a.75.75 0 0 1 0 1.06l-2 2a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L10.69 8 9.22 6.53a.75.75 0 0 1 0-1.06ZM6.78 6.53 5.31 8l1.47 1.47a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215l-2-2a.75.75 0 0 1 0-1.06l2-2a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </template> <template id="device-desktop-icon"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-device-desktop"> <path d="M14.25 1c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 14.25 12h-3.727c.099 1.041.52 1.872 1.292 2.757A.752.752 0 0 1 11.25 16h-6.5a.75.75 0 0 1-.565-1.243c.772-.885 1.192-1.716 1.292-2.757H1.75A1.75 1.75 0 0 1 0 10.25v-7.5C0 1.784.784 1 1.75 1ZM1.75 2.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25ZM9.018 12H6.982a5.72 5.72 0 0 1-.765 2.5h3.566a5.72 5.72 0 0 1-.765-2.5Z"></path> </svg> </template> <div class="position-relative"> <ul role="listbox" class="ActionListWrap QueryBuilder-ListWrap" aria-label="Suggestions" data-action=" combobox-commit:query-builder#comboboxCommit mousedown:query-builder#resultsMousedown " data-target="query-builder.resultsList" data-persist-list=false id="query-builder-test-results" ></ul> </div> <div class="FormControl-inlineValidation" id="validation-59b5c55d-c25e-4570-9498-067fa0b35de5" hidden="hidden"> <span class="FormControl-inlineValidation--visual"> <svg aria-hidden="true" height="12" viewBox="0 0 12 12" version="1.1" width="12" data-view-component="true" class="octicon octicon-alert-fill"> <path d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"></path> </svg> </span> <span></span> </div> </div> <div data-target="query-builder.screenReaderFeedback" aria-live="polite" aria-atomic="true" class="sr-only"></div> </query-builder></form> <div class="d-flex flex-row color-fg-muted px-3 text-small color-bg-default search-feedback-prompt"> <a target="_blank" href="https://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax" data-view-component="true" class="Link color-fg-accent text-normal ml-2">Search syntax tips</a> <div class="d-flex flex-1"></div> </div> </div> </div> </div> </modal-dialog></div> </div> <div data-action="click:qbsearch-input#retract" class="dark-backdrop position-fixed" hidden data-target="qbsearch-input.darkBackdrop"></div> <div class="color-fg-default"> <dialog-helper> <dialog data-target="qbsearch-input.feedbackDialog" data-action="close:qbsearch-input#handleDialogClose cancel:qbsearch-input#handleDialogClose" id="feedback-dialog" aria-modal="true" aria-labelledby="feedback-dialog-title" aria-describedby="feedback-dialog-description" data-view-component="true" class="Overlay Overlay-whenNarrow Overlay--size-medium Overlay--motion-scaleFade Overlay--disableScroll"> <div data-view-component="true" class="Overlay-header"> <div class="Overlay-headerContentWrap"> <div class="Overlay-titleWrap"> <h1 class="Overlay-title " id="feedback-dialog-title"> Provide feedback </h1> </div> <div class="Overlay-actionWrap"> <button data-close-dialog-id="feedback-dialog" aria-label="Close" type="button" data-view-component="true" class="close-button Overlay-closeButton"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg></button> </div> </div> </div> <scrollable-region data-labelled-by="feedback-dialog-title"> <div data-view-component="true" class="Overlay-body"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form id="code-search-feedback-form" data-turbo="false" action="/search/feedback" accept-charset="UTF-8" method="post"><input type="hidden" data-csrf="true" name="authenticity_token" value="vdmw04+yPxemqWCiWLGzxhmVHWd1bpASPPkdzXZOXZ37n/rva7OiinA+ERSMqSCNcls34YC3GABQUDu6uFhHoA==" /> <p>We read every piece of feedback, and take your input very seriously.</p> <textarea name="feedback" class="form-control width-full mb-2" style="height: 120px" id="feedback"></textarea> <input name="include_email" id="include_email" aria-label="Include my email address so I can be contacted" class="form-control mr-2" type="checkbox"> <label for="include_email" style="font-weight: normal">Include my email address so I can be contacted</label> </form></div> </scrollable-region> <div data-view-component="true" class="Overlay-footer Overlay-footer--alignEnd"> <button data-close-dialog-id="feedback-dialog" type="button" data-view-component="true" class="btn"> Cancel </button> <button form="code-search-feedback-form" data-action="click:qbsearch-input#submitFeedback" type="submit" data-view-component="true" class="btn-primary btn"> Submit feedback </button> </div> </dialog></dialog-helper> <custom-scopes data-target="qbsearch-input.customScopesManager"> <dialog-helper> <dialog data-target="custom-scopes.customScopesModalDialog" data-action="close:qbsearch-input#handleDialogClose cancel:qbsearch-input#handleDialogClose" id="custom-scopes-dialog" aria-modal="true" aria-labelledby="custom-scopes-dialog-title" aria-describedby="custom-scopes-dialog-description" data-view-component="true" class="Overlay Overlay-whenNarrow Overlay--size-medium Overlay--motion-scaleFade Overlay--disableScroll"> <div data-view-component="true" class="Overlay-header Overlay-header--divided"> <div class="Overlay-headerContentWrap"> <div class="Overlay-titleWrap"> <h1 class="Overlay-title " id="custom-scopes-dialog-title"> Saved searches </h1> <h2 id="custom-scopes-dialog-description" class="Overlay-description">Use saved searches to filter your results more quickly</h2> </div> <div class="Overlay-actionWrap"> <button data-close-dialog-id="custom-scopes-dialog" aria-label="Close" type="button" data-view-component="true" class="close-button Overlay-closeButton"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg></button> </div> </div> </div> <scrollable-region data-labelled-by="custom-scopes-dialog-title"> <div data-view-component="true" class="Overlay-body"> <div data-target="custom-scopes.customScopesModalDialogFlash"></div> <div hidden class="create-custom-scope-form" data-target="custom-scopes.createCustomScopeForm"> <!-- '"` --><!-- </textarea></xmp> --></option></form><form id="custom-scopes-dialog-form" data-turbo="false" action="/search/custom_scopes" accept-charset="UTF-8" method="post"><input type="hidden" data-csrf="true" name="authenticity_token" value="bnV14j2WXsi/B2ysWSFoqAef3XG564+Ydgc0kwklcl32PqCNYvV2POyaMJxU9aylDJYQVErCvSZzNaKlP6w3vg==" /> <div data-target="custom-scopes.customScopesModalDialogFlash"></div> <input type="hidden" id="custom_scope_id" name="custom_scope_id" data-target="custom-scopes.customScopesIdField"> <div class="form-group"> <label for="custom_scope_name">Name</label> <auto-check src="/search/custom_scopes/check_name" required only-validate-on-blur="false"> <input type="text" name="custom_scope_name" id="custom_scope_name" data-target="custom-scopes.customScopesNameField" class="form-control" autocomplete="off" placeholder="github-ruby" required maxlength="50"> <input type="hidden" data-csrf="true" value="6FwCAE/NYq8NPIQGzFjPJ8jkCmPcRSLAuJksEndsnSQo4/R6qw5ysWVGEAgT+tT9nNY9dydkN559G4MTn2ffow==" /> </auto-check> </div> <div class="form-group"> <label for="custom_scope_query">Query</label> <input type="text" name="custom_scope_query" id="custom_scope_query" data-target="custom-scopes.customScopesQueryField" class="form-control" autocomplete="off" placeholder="(repo:mona/a OR repo:mona/b) AND lang:python" required maxlength="500"> </div> <p class="text-small color-fg-muted"> To see all available qualifiers, see our <a class="Link--inTextBlock" href="https://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax">documentation</a>. </p> </form> </div> <div data-target="custom-scopes.manageCustomScopesForm"> <div data-target="custom-scopes.list"></div> </div> </div> </scrollable-region> <div data-view-component="true" class="Overlay-footer Overlay-footer--alignEnd Overlay-footer--divided"> <button data-action="click:custom-scopes#customScopesCancel" type="button" data-view-component="true" class="btn"> Cancel </button> <button form="custom-scopes-dialog-form" data-action="click:custom-scopes#customScopesSubmit" data-target="custom-scopes.customScopesSubmitButton" type="submit" data-view-component="true" class="btn-primary btn"> Create saved search </button> </div> </dialog></dialog-helper> </custom-scopes> </div> </qbsearch-input> <div class="position-relative HeaderMenu-link-wrap d-lg-inline-block"> <a href="/login?return_to=https%3A%2F%2Fgithub.com%2Fniklak%2Fdom_query" class="HeaderMenu-link HeaderMenu-link--sign-in HeaderMenu-button flex-shrink-0 no-underline d-none d-lg-inline-flex border border-lg-0 rounded rounded-lg-0 px-2 py-1" style="margin-left: 12px;" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"site header menu","repository_id":null,"auth_type":"SIGN_UP","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="7fa0152bdea4de791d7d131e08c3ad3e3eaa7181b7256ac99cd9e45c41bed6f0" data-analytics-event="{"category":"Marketing nav","action":"click to go to homepage","label":"ref_page:Marketing;ref_cta:Sign in;ref_loc:Header"}" > Sign in </a> </div> <a href="/signup?ref_cta=Sign+up&ref_loc=header+logged+out&ref_page=%2F%3Cuser-name%3E%2F%3Crepo-name%3E&source=header-repo&source_repo=niklak%2Fdom_query" class="HeaderMenu-link HeaderMenu-link--sign-up HeaderMenu-button flex-shrink-0 d-flex d-lg-inline-flex no-underline border color-border-default rounded px-2 py-1" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"site header menu","repository_id":null,"auth_type":"SIGN_UP","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="7fa0152bdea4de791d7d131e08c3ad3e3eaa7181b7256ac99cd9e45c41bed6f0" data-analytics-event="{"category":"Sign up","action":"click to sign up for account","label":"ref_page:/<user-name>/<repo-name>;ref_cta:Sign up;ref_loc:header logged out"}" > Sign up </a> <button type="button" class="sr-only js-header-menu-focus-trap d-block d-lg-none">Reseting focus</button> </div> </div> </div> </div> </header> <div hidden="hidden" data-view-component="true" class="js-stale-session-flash stale-session-flash flash flash-warn flash-full"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <span class="js-stale-session-flash-signed-in" hidden>You signed in with another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <span class="js-stale-session-flash-signed-out" hidden>You signed out in another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <span class="js-stale-session-flash-switched" hidden>You switched accounts on another tab or window. <a class="Link--inTextBlock" href="">Reload</a> to refresh your session.</span> <button id="icon-button-c5391fc7-068a-4e76-bd33-7c2fc5d9a772" aria-labelledby="tooltip-9c0490ee-bd87-4e07-bd2e-bc6c2af4535e" type="button" data-view-component="true" class="Button Button--iconOnly Button--invisible Button--medium flash-close js-flash-close"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x Button-visual"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button><tool-tip id="tooltip-9c0490ee-bd87-4e07-bd2e-bc6c2af4535e" for="icon-button-c5391fc7-068a-4e76-bd33-7c2fc5d9a772" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Dismiss alert</tool-tip> </div> </div> <div id="start-of-content" class="show-on-focus"></div> <div id="js-flash-container" class="flash-container" data-turbo-replace> <template class="js-flash-template"> <div class="flash flash-full {{ className }}"> <div > <button autofocus class="flash-close js-flash-close" type="button" aria-label="Dismiss this message"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> <div aria-atomic="true" role="alert" class="js-flash-alert"> <div>{{ message }}</div> </div> </div> </div> </template> </div> <div class="application-main " data-commit-hovercards-enabled data-discussion-hovercards-enabled data-issue-and-pr-hovercards-enabled data-project-hovercards-enabled > <div itemscope itemtype="http://schema.org/SoftwareSourceCode" class=""> <main id="js-repo-pjax-container" > <div id="repository-container-header" class="pt-3 hide-full-screen" style="background-color: var(--page-header-bgColor, var(--color-page-header-bg));" data-turbo-replace> <div class="d-flex flex-nowrap flex-justify-end mb-3 px-3 px-lg-5" style="gap: 1rem;"> <div class="flex-auto min-width-0 width-fit"> <div class=" d-flex flex-wrap flex-items-center wb-break-word f3 text-normal"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo color-fg-muted mr-2"> <path d="M2 2.5A2.5 2.5 0 0 1 4.5 0h8.75a.75.75 0 0 1 .75.75v12.5a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1 0-1.5h1.75v-2h-8a1 1 0 0 0-.714 1.7.75.75 0 1 1-1.072 1.05A2.495 2.495 0 0 1 2 11.5Zm10.5-1h-8a1 1 0 0 0-1 1v6.708A2.486 2.486 0 0 1 4.5 9h8ZM5 12.25a.25.25 0 0 1 .25-.25h3.5a.25.25 0 0 1 .25.25v3.25a.25.25 0 0 1-.4.2l-1.45-1.087a.249.249 0 0 0-.3 0L5.4 15.7a.25.25 0 0 1-.4-.2Z"></path> </svg> <span class="author flex-self-stretch" itemprop="author"> <a class="url fn" rel="author" data-hovercard-type="user" data-hovercard-url="/users/niklak/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/niklak"> niklak </a> </span> <span class="mx-1 flex-self-stretch color-fg-muted">/</span> <strong itemprop="name" class="mr-2 flex-self-stretch"> <a data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" href="/niklak/dom_query">dom_query</a> </strong> <span></span><span class="Label Label--secondary v-align-middle mr-1">Public</span> </div> </div> <div id="repository-details-container" class="flex-shrink-0" data-turbo-replace style="max-width: 70%;"> <ul class="pagehead-actions flex-shrink-0 d-none d-md-inline" style="padding: 2px 0;"> <li> <a href="/login?return_to=%2Fniklak%2Fdom_query" rel="nofollow" id="repository-details-watch-button" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"notification subscription menu watch","repository_id":null,"auth_type":"LOG_IN","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="99b96010cade3e95315571057e1d2f353eb3adbc1ac868ae1335a9d1ede308c3" aria-label="You must be signed in to change notification settings" data-view-component="true" class="btn-sm btn"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-bell mr-2"> <path d="M8 16a2 2 0 0 0 1.985-1.75c.017-.137-.097-.25-.235-.25h-3.5c-.138 0-.252.113-.235.25A2 2 0 0 0 8 16ZM3 5a5 5 0 0 1 10 0v2.947c0 .05.015.098.042.139l1.703 2.555A1.519 1.519 0 0 1 13.482 13H2.518a1.516 1.516 0 0 1-1.263-2.36l1.703-2.554A.255.255 0 0 0 3 7.947Zm5-3.5A3.5 3.5 0 0 0 4.5 5v2.947c0 .346-.102.683-.294.97l-1.703 2.556a.017.017 0 0 0-.003.01l.001.006c0 .002.002.004.004.006l.006.004.007.001h10.964l.007-.001.006-.004.004-.006.001-.007a.017.017 0 0 0-.003-.01l-1.703-2.554a1.745 1.745 0 0 1-.294-.97V5A3.5 3.5 0 0 0 8 1.5Z"></path> </svg>Notifications </a> <tool-tip id="tooltip-cbd7a9a6-f890-451b-a1f3-7b85165fffcf" for="repository-details-watch-button" popover="manual" data-direction="s" data-type="description" data-view-component="true" class="sr-only position-absolute">You must be signed in to change notification settings</tool-tip> </li> <li> <a icon="repo-forked" id="fork-button" href="/login?return_to=%2Fniklak%2Fdom_query" rel="nofollow" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"repo details fork button","repository_id":734642713,"auth_type":"LOG_IN","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="b989f21837816d854b84f553cabdfffc0763a6044effa6f6c30b91493ad1915a" data-view-component="true" class="btn-sm btn"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo-forked mr-2"> <path d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z"></path> </svg>Fork <span id="repo-network-counter" data-pjax-replace="true" data-turbo-replace="true" title="6" data-view-component="true" class="Counter">6</span> </a> </li> <li> <div data-view-component="true" class="BtnGroup d-flex"> <a href="/login?return_to=%2Fniklak%2Fdom_query" rel="nofollow" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"star button","repository_id":734642713,"auth_type":"LOG_IN","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="8d6a93e102a1d5bbb13d8e636d9f4d59a21b110e5861a173946495a4f6f352a6" aria-label="You must be signed in to star a repository" data-view-component="true" class="tooltipped tooltipped-sw btn-sm btn"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-star v-align-text-bottom d-inline-block mr-2"> <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path> </svg><span data-view-component="true" class="d-inline"> Star </span> <span id="repo-stars-counter-star" aria-label="63 users starred this repository" data-singular-suffix="user starred this repository" data-plural-suffix="users starred this repository" data-turbo-replace="true" title="63" data-view-component="true" class="Counter js-social-count">63</span> </a></div> </li> </ul> </div> </div> <div id="responsive-meta-container" data-turbo-replace> <div class="d-block d-md-none mb-2 px-3 px-md-4 px-lg-5"> <p class="f4 mb-3 "> A Flexible Rust Crate for DOM Querying and Manipulation </p> <div class="mb-2 d-flex flex-items-center Link--secondary"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link flex-shrink-0 mr-2"> <path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path> </svg> <span class="flex-auto min-width-0 css-truncate css-truncate-target width-fit"> <a title="https://docs.rs/dom_query" role="link" target="_blank" class="text-bold" rel="noopener noreferrer" href="https://docs.rs/dom_query">docs.rs/dom_query</a> </span> </div> <h3 class="sr-only">License</h3> <div class="mb-2"> <a href="/niklak/dom_query/blob/main/LICENSE" class="Link--muted" data-analytics-event="{"category":"Repository Overview","action":"click","label":"location:sidebar;file:license"}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-law mr-2"> <path d="M8.75.75V2h.985c.304 0 .603.08.867.231l1.29.736c.038.022.08.033.124.033h2.234a.75.75 0 0 1 0 1.5h-.427l2.111 4.692a.75.75 0 0 1-.154.838l-.53-.53.529.531-.001.002-.002.002-.006.006-.006.005-.01.01-.045.04c-.21.176-.441.327-.686.45C14.556 10.78 13.88 11 13 11a4.498 4.498 0 0 1-2.023-.454 3.544 3.544 0 0 1-.686-.45l-.045-.04-.016-.015-.006-.006-.004-.004v-.001a.75.75 0 0 1-.154-.838L12.178 4.5h-.162c-.305 0-.604-.079-.868-.231l-1.29-.736a.245.245 0 0 0-.124-.033H8.75V13h2.5a.75.75 0 0 1 0 1.5h-6.5a.75.75 0 0 1 0-1.5h2.5V3.5h-.984a.245.245 0 0 0-.124.033l-1.289.737c-.265.15-.564.23-.869.23h-.162l2.112 4.692a.75.75 0 0 1-.154.838l-.53-.53.529.531-.001.002-.002.002-.006.006-.016.015-.045.04c-.21.176-.441.327-.686.45C4.556 10.78 3.88 11 3 11a4.498 4.498 0 0 1-2.023-.454 3.544 3.544 0 0 1-.686-.45l-.045-.04-.016-.015-.006-.006-.004-.004v-.001a.75.75 0 0 1-.154-.838L2.178 4.5H1.75a.75.75 0 0 1 0-1.5h2.234a.249.249 0 0 0 .125-.033l1.288-.737c.265-.15.564-.23.869-.23h.984V.75a.75.75 0 0 1 1.5 0Zm2.945 8.477c.285.135.718.273 1.305.273s1.02-.138 1.305-.273L13 6.327Zm-10 0c.285.135.718.273 1.305.273s1.02-.138 1.305-.273L3 6.327Z"></path> </svg> MIT license </a> </div> <div class="mb-3"> <a class="Link--secondary no-underline mr-3" href="/niklak/dom_query/stargazers"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-star mr-1"> <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path> </svg> <span class="text-bold">63</span> stars </a> <a class="Link--secondary no-underline mr-3" href="/niklak/dom_query/forks"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo-forked mr-1"> <path d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z"></path> </svg> <span class="text-bold">6</span> forks </a> <a class="Link--secondary no-underline mr-3 d-inline-block" href="/niklak/dom_query/branches"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-branch mr-1"> <path d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z"></path> </svg> <span>Branches</span> </a> <a class="Link--secondary no-underline d-inline-block" href="/niklak/dom_query/tags"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag mr-1"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <span>Tags</span> </a> <a class="Link--secondary no-underline d-inline-block" href="/niklak/dom_query/activity"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-pulse mr-1"> <path d="M6 2c.306 0 .582.187.696.471L10 10.731l1.304-3.26A.751.751 0 0 1 12 7h3.25a.75.75 0 0 1 0 1.5h-2.742l-1.812 4.528a.751.751 0 0 1-1.392 0L6 4.77 4.696 8.03A.75.75 0 0 1 4 8.5H.75a.75.75 0 0 1 0-1.5h2.742l1.812-4.529A.751.751 0 0 1 6 2Z"></path> </svg> <span>Activity</span> </a> </div> <div class="d-flex flex-wrap gap-2"> <div class="flex-1"> <div data-view-component="true" class="BtnGroup d-flex"> <a href="/login?return_to=%2Fniklak%2Fdom_query" rel="nofollow" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"star button","repository_id":734642713,"auth_type":"LOG_IN","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="8d6a93e102a1d5bbb13d8e636d9f4d59a21b110e5861a173946495a4f6f352a6" aria-label="You must be signed in to star a repository" data-view-component="true" class="tooltipped tooltipped-sw btn-sm btn btn-block"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-star v-align-text-bottom d-inline-block mr-2"> <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path> </svg><span data-view-component="true" class="d-inline"> Star </span> </a></div> </div> <div class="flex-1"> <a href="/login?return_to=%2Fniklak%2Fdom_query" rel="nofollow" id="files-overview-watch-button" data-hydro-click="{"event_type":"authentication.click","payload":{"location_in_page":"notification subscription menu watch","repository_id":null,"auth_type":"LOG_IN","originating_url":"https://github.com/niklak/dom_query","user_id":null}}" data-hydro-click-hmac="99b96010cade3e95315571057e1d2f353eb3adbc1ac868ae1335a9d1ede308c3" aria-label="You must be signed in to change notification settings" data-view-component="true" class="btn-sm btn btn-block"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-bell mr-2"> <path d="M8 16a2 2 0 0 0 1.985-1.75c.017-.137-.097-.25-.235-.25h-3.5c-.138 0-.252.113-.235.25A2 2 0 0 0 8 16ZM3 5a5 5 0 0 1 10 0v2.947c0 .05.015.098.042.139l1.703 2.555A1.519 1.519 0 0 1 13.482 13H2.518a1.516 1.516 0 0 1-1.263-2.36l1.703-2.554A.255.255 0 0 0 3 7.947Zm5-3.5A3.5 3.5 0 0 0 4.5 5v2.947c0 .346-.102.683-.294.97l-1.703 2.556a.017.017 0 0 0-.003.01l.001.006c0 .002.002.004.004.006l.006.004.007.001h10.964l.007-.001.006-.004.004-.006.001-.007a.017.017 0 0 0-.003-.01l-1.703-2.554a1.745 1.745 0 0 1-.294-.97V5A3.5 3.5 0 0 0 8 1.5Z"></path> </svg>Notifications </a> <tool-tip id="tooltip-9ba6f142-44df-4613-9afa-11f07dc41fb2" for="files-overview-watch-button" popover="manual" data-direction="s" data-type="description" data-view-component="true" class="sr-only position-absolute">You must be signed in to change notification settings</tool-tip> </div> <span> </span> </div> </div> </div> <nav data-pjax="#js-repo-pjax-container" aria-label="Repository" data-view-component="true" class="js-repo-nav js-sidenav-container-pjax js-responsive-underlinenav overflow-hidden UnderlineNav px-3 px-md-4 px-lg-5"> <ul data-view-component="true" class="UnderlineNav-body list-style-none"> <li data-view-component="true" class="d-inline-flex"> <a id="code-tab" href="/niklak/dom_query" data-tab-item="i0code-tab" data-selected-links="repo_source repo_downloads repo_commits repo_releases repo_tags repo_branches repo_packages repo_deployments repo_attestations /niklak/dom_query" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g c" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Code","target":"UNDERLINE_NAV.TAB"}" aria-current="page" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item selected"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code UnderlineNav-octicon d-none d-sm-inline"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> <span data-content="Code">Code</span> <span id="code-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="issues-tab" href="/niklak/dom_query/issues" data-tab-item="i1issues-tab" data-selected-links="repo_issues repo_labels repo_milestones /niklak/dom_query/issues" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g i" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Issues","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-issue-opened UnderlineNav-octicon d-none d-sm-inline"> <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path> </svg> <span data-content="Issues">Issues</span> <span id="issues-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="0" hidden="hidden" data-view-component="true" class="Counter">0</span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="pull-requests-tab" href="/niklak/dom_query/pulls" data-tab-item="i2pull-requests-tab" data-selected-links="repo_pulls checks /niklak/dom_query/pulls" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g p" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Pull requests","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-pull-request UnderlineNav-octicon d-none d-sm-inline"> <path d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"></path> </svg> <span data-content="Pull requests">Pull requests</span> <span id="pull-requests-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="0" hidden="hidden" data-view-component="true" class="Counter">0</span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="actions-tab" href="/niklak/dom_query/actions" data-tab-item="i3actions-tab" data-selected-links="repo_actions /niklak/dom_query/actions" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g a" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Actions","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-play UnderlineNav-octicon d-none d-sm-inline"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z"></path> </svg> <span data-content="Actions">Actions</span> <span id="actions-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="projects-tab" href="/niklak/dom_query/projects" data-tab-item="i4projects-tab" data-selected-links="repo_projects new_repo_project repo_project /niklak/dom_query/projects" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g b" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Projects","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-table UnderlineNav-octicon d-none d-sm-inline"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25ZM6.5 6.5v8h7.75a.25.25 0 0 0 .25-.25V6.5Zm8-1.5V1.75a.25.25 0 0 0-.25-.25H6.5V5Zm-13 1.5v7.75c0 .138.112.25.25.25H5v-8ZM5 5V1.5H1.75a.25.25 0 0 0-.25.25V5Z"></path> </svg> <span data-content="Projects">Projects</span> <span id="projects-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="0" hidden="hidden" data-view-component="true" class="Counter">0</span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="wiki-tab" href="/niklak/dom_query/wiki" data-tab-item="i5wiki-tab" data-selected-links="repo_wiki /niklak/dom_query/wiki" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g w" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Wiki","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book UnderlineNav-octicon d-none d-sm-inline"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> <span data-content="Wiki">Wiki</span> <span id="wiki-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="security-tab" href="/niklak/dom_query/security" data-tab-item="i6security-tab" data-selected-links="security overview alerts policy token_scanning code_scanning /niklak/dom_query/security" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-hotkey="g s" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Security","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-shield UnderlineNav-octicon d-none d-sm-inline"> <path d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <span data-content="Security">Security</span> <include-fragment src="/niklak/dom_query/security/overall-count" accept="text/fragment+html"></include-fragment> </a></li> <li data-view-component="true" class="d-inline-flex"> <a id="insights-tab" href="/niklak/dom_query/pulse" data-tab-item="i7insights-tab" data-selected-links="repo_graphs repo_contributors dependency_graph dependabot_updates pulse people community /niklak/dom_query/pulse" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" data-analytics-event="{"category":"Underline navbar","action":"Click tab","label":"Insights","target":"UNDERLINE_NAV.TAB"}" data-view-component="true" class="UnderlineNav-item no-wrap js-responsive-underlinenav-item js-selected-navigation-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-graph UnderlineNav-octicon d-none d-sm-inline"> <path d="M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> <span data-content="Insights">Insights</span> <span id="insights-repo-tab-count" data-pjax-replace="" data-turbo-replace="" title="Not available" data-view-component="true" class="Counter"></span> </a></li> </ul> <div style="visibility:hidden;" data-view-component="true" class="UnderlineNav-actions js-responsive-underlinenav-overflow position-absolute pr-3 pr-md-4 pr-lg-5 right-0"> <action-menu data-select-variant="none" data-view-component="true"> <focus-group direction="vertical" mnemonics retain> <button id="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-button" popovertarget="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-overlay" aria-controls="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-list" aria-haspopup="true" aria-labelledby="tooltip-459e0506-9a91-4034-9518-c18370eb8852" type="button" data-view-component="true" class="Button Button--iconOnly Button--secondary Button--medium UnderlineNav-item"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-kebab-horizontal Button-visual"> <path d="M8 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3ZM1.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm13 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path> </svg> </button><tool-tip id="tooltip-459e0506-9a91-4034-9518-c18370eb8852" for="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-button" popover="manual" data-direction="s" data-type="label" data-view-component="true" class="sr-only position-absolute">Additional navigation options</tool-tip> <anchored-position data-target="action-menu.overlay" id="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-overlay" anchor="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-button" align="start" side="outside-bottom" anchor-offset="normal" popover="auto" data-view-component="true"> <div data-view-component="true" class="Overlay Overlay--size-auto"> <div data-view-component="true" class="Overlay-body Overlay-body--paddingNone"> <action-list> <div data-view-component="true"> <ul aria-labelledby="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-button" id="action-menu-fe2cb8c7-accf-4f3d-8bd0-30caedca84b0-list" role="menu" data-view-component="true" class="ActionListWrap--inset ActionListWrap"> <li hidden="hidden" data-menu-item="i0code-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-11cc8b22-a0f1-4a01-958b-de437654545f" href="/niklak/dom_query" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-code"> <path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Code </span> </a> </li> <li hidden="hidden" data-menu-item="i1issues-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-9738fc75-3dd3-4772-97db-97564f15ada7" href="/niklak/dom_query/issues" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-issue-opened"> <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Issues </span> </a> </li> <li hidden="hidden" data-menu-item="i2pull-requests-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-7c5647ce-9f9e-4ef6-8601-208725e09f50" href="/niklak/dom_query/pulls" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-git-pull-request"> <path d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Pull requests </span> </a> </li> <li hidden="hidden" data-menu-item="i3actions-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-1b8af5a3-12e1-4baf-a972-1cbaeff28ca3" href="/niklak/dom_query/actions" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-play"> <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Actions </span> </a> </li> <li hidden="hidden" data-menu-item="i4projects-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-e03b0865-6c89-44c6-ba29-187ef873bb34" href="/niklak/dom_query/projects" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-table"> <path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v12.5A1.75 1.75 0 0 1 14.25 16H1.75A1.75 1.75 0 0 1 0 14.25ZM6.5 6.5v8h7.75a.25.25 0 0 0 .25-.25V6.5Zm8-1.5V1.75a.25.25 0 0 0-.25-.25H6.5V5Zm-13 1.5v7.75c0 .138.112.25.25.25H5v-8ZM5 5V1.5H1.75a.25.25 0 0 0-.25.25V5Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Projects </span> </a> </li> <li hidden="hidden" data-menu-item="i5wiki-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-735537c3-298c-44d9-bc27-e407dae49c8a" href="/niklak/dom_query/wiki" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Wiki </span> </a> </li> <li hidden="hidden" data-menu-item="i6security-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-5b3e77e3-f928-4c0d-90b3-11b99e8f3ca1" href="/niklak/dom_query/security" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-shield"> <path d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Security </span> </a> </li> <li hidden="hidden" data-menu-item="i7insights-tab" data-targets="action-list.items" role="none" data-view-component="true" class="ActionListItem"> <a tabindex="-1" id="item-7a0a05a8-59de-4ba5-9c7d-b0e433c6bb7e" href="/niklak/dom_query/pulse" role="menuitem" data-view-component="true" class="ActionListContent ActionListContent--visual16"> <span class="ActionListItem-visual ActionListItem-visual--leading"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-graph"> <path d="M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"></path> </svg> </span> <span data-view-component="true" class="ActionListItem-label"> Insights </span> </a> </li> </ul> </div></action-list> </div> </div></anchored-position> </focus-group> </action-menu></div> </nav> </div> <turbo-frame id="repo-content-turbo-frame" target="_top" data-turbo-action="advance" class=""> <div id="repo-content-pjax-container" class="repository-content " > <h1 class='sr-only'>niklak/dom_query</h1> <div class="clearfix container-xl px-md-4 px-lg-5 px-3"> <div> <div style="max-width: 100%" data-view-component="true" class="Layout Layout--flowRow-until-md react-repos-overview-margin Layout--sidebarPosition-end Layout--sidebarPosition-flowRow-end"> <div data-view-component="true" class="Layout-main"> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_dompurify_dist_purify_es_mjs-dd1d3ea6a436.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/vendors-node_modules_tanstack_query-core_build_modern_queryObserver_js-node_modules_tanstack_-defd52-843b41414e0e.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_aria-live_aria-live_ts-ui_packages_promise-with-resolvers-polyfill_promise-with-r-17c672-34345cb18aac.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_paths_index_ts-e019c54eb886.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_ref-selector_RefSelector_tsx-7496afc3784d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_commit-attribution_index_ts-ui_packages_commit-checks-status_index_ts-ui_packages-7094d4-15017f02e61c.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_code-view-shared_hooks_shortcuts_ts-ui_packages_code-view-shared_utilities_styles-0dc246-f8753c5db08d.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/ui_packages_code-view-shared_hooks_use-canonical-object_ts-ui_packages_code-view-shared_hooks-a83ec0-5ee2b562b57f.js"></script> <script crossorigin="anonymous" defer="defer" type="application/javascript" src="https://github.githubassets.com/assets/repos-overview-ca785c0ab4fa.js"></script> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-react.e0c9f0687c56358ed85e.module.css" /> <link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/repos-overview.0ee7cac3ab511a65d9f9.module.css" /> <react-partial partial-name="repos-overview" data-ssr="true" data-attempted-ssr="true" > <script type="application/json" data-target="react-partial.embeddedData">{"props":{"initialPayload":{"allShortcutsEnabled":false,"path":"/","repo":{"id":734642713,"defaultBranch":"main","name":"dom_query","ownerLogin":"niklak","currentUserCanPush":false,"isFork":false,"isEmpty":false,"createdAt":"2023-12-22T08:09:20.000Z","ownerAvatar":"https://avatars.githubusercontent.com/u/15178803?v=4","public":true,"private":false,"isOrgOwned":false},"currentUser":null,"refInfo":{"name":"main","listCacheKey":"v0:1742393913.0","canEdit":false,"refType":"branch","currentOid":"99f0fcfa40fe053fdc13dbef4c665c121bf24315"},"tree":{"items":[{"name":".cargo","path":".cargo","contentType":"directory"},{"name":".github","path":".github","contentType":"directory"},{"name":"examples","path":"examples","contentType":"directory"},{"name":"src","path":"src","contentType":"directory"},{"name":"test-pages","path":"test-pages","contentType":"directory"},{"name":"tests","path":"tests","contentType":"directory"},{"name":".gitattributes","path":".gitattributes","contentType":"file"},{"name":".gitignore","path":".gitignore","contentType":"file"},{"name":"CHANGELOG.md","path":"CHANGELOG.md","contentType":"file"},{"name":"Cargo.toml","path":"Cargo.toml","contentType":"file"},{"name":"Examples.md","path":"Examples.md","contentType":"file"},{"name":"LICENSE","path":"LICENSE","contentType":"file"},{"name":"README.md","path":"README.md","contentType":"file"}],"templateDirectorySuggestionUrl":null,"readme":null,"totalCount":13,"showBranchInfobar":false},"fileTree":null,"fileTreeProcessingTime":null,"foldersToFetch":[],"treeExpanded":false,"symbolsExpanded":false,"isOverview":true,"overview":{"banners":{"shouldRecommendReadme":false,"isPersonalRepo":false,"showUseActionBanner":false,"actionSlug":null,"actionId":null,"showProtectBranchBanner":false,"publishBannersInfo":{"dismissActionNoticePath":"/settings/dismiss-notice/publish_action_from_repo","releasePath":"/niklak/dom_query/releases/new?marketplace=true","showPublishActionBanner":false},"interactionLimitBanner":null,"showInvitationBanner":false,"inviterName":null,"actionsMigrationBannerInfo":{"releaseTags":[],"showImmutableActionsMigrationBanner":false,"initialMigrationStatus":null}},"codeButton":{"contactPath":"/contact","isEnterprise":false,"local":{"protocolInfo":{"httpAvailable":true,"sshAvailable":null,"httpUrl":"https://github.com/niklak/dom_query.git","showCloneWarning":null,"sshUrl":null,"sshCertificatesRequired":null,"sshCertificatesAvailable":null,"ghCliUrl":"gh repo clone niklak/dom_query","defaultProtocol":"http","newSshKeyUrl":"/settings/ssh/new","setProtocolPath":"/users/set_protocol"},"platformInfo":{"cloneUrl":"https://desktop.github.com","showVisualStudioCloneButton":false,"visualStudioCloneUrl":"https://windows.github.com","showXcodeCloneButton":false,"xcodeCloneUrl":"xcode://clone?repo=https%3A%2F%2Fgithub.com%2Fniklak%2Fdom_query","zipballUrl":"/niklak/dom_query/archive/refs/heads/main.zip"}},"newCodespacePath":"/codespaces/new?hide_repo_select=true\u0026repo=734642713"},"popovers":{"rename":null,"renamedParentRepo":null},"commitCount":"568","overviewFiles":[{"displayName":"README.md","repoName":"dom_query","refName":"main","path":"README.md","preferredFileType":"readme","tabName":"README","richText":"\u003carticle class=\"markdown-body entry-content container-lg\" itemprop=\"text\"\u003e\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch1 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eDOM_QUERY: A Flexible Rust Crate for DOM Querying and Manipulation\u003c/h1\u003e\u003ca id=\"user-content-dom_query-a-flexible-rust-crate-for-dom-querying-and-manipulation\" class=\"anchor\" aria-label=\"Permalink: DOM_QUERY: A Flexible Rust Crate for DOM Querying and Manipulation\" href=\"#dom_query-a-flexible-rust-crate-for-dom-querying-and-manipulation\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cp dir=\"auto\"\u003e\u003ca href=\"https://crates.io/crates/dom_query\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/a35f3f5f7a1ef7f9f27d052df34edd7cad8d9e19427131b241b09b7ff95d2110/68747470733a2f2f696d672e736869656c64732e696f2f6372617465732f762f646f6d5f71756572792e7376673f7374796c653d666c6174\" alt=\"Crates.io version\" data-canonical-src=\"https://img.shields.io/crates/v/dom_query.svg?style=flat\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://crates.io/crates/dom_query\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/97baccacf6b27855a154855e0a6f0f4d2c13142d19bbcdeed4744f271742702f/68747470733a2f2f696d672e736869656c64732e696f2f6372617465732f642f646f6d5f71756572792e7376673f7374796c653d666c6174\" alt=\"Download\" data-canonical-src=\"https://img.shields.io/crates/d/dom_query.svg?style=flat\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://docs.rs/dom_query\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/bb4bae7218ec61145d467f1d4c03759410b18a010a156d8813339f75e33a0c58/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f646f63732d6c61746573742d626c75652e7376673f7374796c653d666c6174\" alt=\"docs.rs docs\" data-canonical-src=\"https://img.shields.io/badge/docs-latest-blue.svg?style=flat\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://codecov.io/gh/niklak/dom_query\" rel=\"nofollow\"\u003e\u003cimg src=\"https://camo.githubusercontent.com/34b428c6864b5f326e5d9cfb730a7e591c3742c5fe9e4e6bcf03ba71ce5547c1/68747470733a2f2f636f6465636f762e696f2f67682f6e696b6c616b2f646f6d5f71756572792f67726170682f62616467652e7376673f746f6b656e3d434641564f494536314f\" alt=\"codecov\" data-canonical-src=\"https://codecov.io/gh/niklak/dom_query/graph/badge.svg?token=CFAVOIE61O\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\u003c/p\u003e\n\u003cp dir=\"auto\"\u003e\u003ca href=\"https://github.com/niklak/dom_query/actions/workflows/rust.yml\"\u003e\u003cimg src=\"https://github.com/niklak/dom_query/actions/workflows/rust.yml/badge.svg?branch=main\" alt=\"Build Status\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://github.com/niklak/dom_query/actions/workflows/raspberrypi5.yml\"\u003e\u003cimg src=\"https://github.com/niklak/dom_query/actions/workflows/raspberrypi5.yml/badge.svg\" alt=\"Raspberry Pi 5 CI\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\n\u003ca href=\"https://github.com/niklak/dom_query/actions/workflows/wasm.yml\"\u003e\u003cimg src=\"https://github.com/niklak/dom_query/actions/workflows/wasm.yml/badge.svg\" alt=\"wasm ci\" style=\"max-width: 100%;\"\u003e\u003c/a\u003e\u003c/p\u003e\n\u003cp dir=\"auto\"\u003eDOM_QUERY is a flexible Rust crate that simplifies HTML parsing, DOM querying and manipulation by providing a high-level jQuery-like API. It uses the \u003ccode\u003ehtml5ever\u003c/code\u003e crate for HTML parsing and the \u003ccode\u003eselectors\u003c/code\u003e crate for efficient DOM traversal and element selection.\u003c/p\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eFeatures\u003c/h2\u003e\u003ca id=\"user-content-features\" class=\"anchor\" aria-label=\"Permalink: Features\" href=\"#features\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cul dir=\"auto\"\u003e\n\u003cli\u003eParse HTML documents and fragments\u003c/li\u003e\n\u003cli\u003eQuery DOM elements using CSS selectors\u003c/li\u003e\n\u003cli\u003eTraverse the DOM tree (ancestors, parents, children, siblings)\u003c/li\u003e\n\u003cli\u003eManipulate elements and their attributes:\n\u003cul dir=\"auto\"\u003e\n\u003cli\u003eAdd/remove/modify attributes\u003c/li\u003e\n\u003cli\u003eChange element content\u003c/li\u003e\n\u003cli\u003eAdd/remove elements\u003c/li\u003e\n\u003cli\u003eRename elements\u003c/li\u003e\n\u003cli\u003eMove elements within the DOM tree\u003c/li\u003e\n\u003c/ul\u003e\n\u003c/li\u003e\n\u003c/ul\u003e\n\u003cdiv class=\"markdown-alert markdown-alert-note\" dir=\"auto\"\u003e\u003cp class=\"markdown-alert-title\" dir=\"auto\"\u003e\u003csvg class=\"octicon octicon-info mr-2\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z\"\u003e\u003c/path\u003e\u003c/svg\u003eNote\u003c/p\u003e\u003cp dir=\"auto\"\u003eThis crate is a significantly enhanced fork of \u003ca href=\"https://crates.io/crates/nipper\" rel=\"nofollow\"\u003enipper\u003c/a\u003e,\nfeaturing expanded CSS selector support, enhanced DOM traversal and improved DOM manipulation capabilities.\u003c/p\u003e\n\u003c/div\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eExamples\u003c/h2\u003e\u003ca id=\"user-content-examples\" class=\"anchor\" aria-label=\"Permalink: Examples\" href=\"#examples\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eParsing a document\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nuse tendril::StrTendril;\n// Document may consume \u0026amp;str, String, StrTendril\nlet contents_str = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\u0026quot;#;\nlet doc = Document::from(contents_str);\n\nlet contents_string = contents_str.to_string();\nlet doc = Document::from(contents_string);\n\nlet contents_tendril = StrTendril::from(contents_str);\nlet doc = Document::from(contents_tendril);\n\n// The root element for the `Document` is a Document\nassert!(doc.root().is_document());\n\n// if the source has DocType, then the Document will also have one\n// as a first child.\nassert!(doc.root().first_child().unwrap().is_doctype());\n\n//both of them are not elements.\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e tendril\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eStrTendril\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// Document may consume \u0026amp;str, String, StrTendril\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents_str = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_str\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents_string = contents_str\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eto_string\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_string\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents_tendril = \u003cspan class=\"pl-smi\"\u003eStrTendril\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_str\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_tendril\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// The root element for the `Document` is a Document\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eroot\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis_document\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// if the source has DocType, then the Document will also have one\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// as a first child.\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eroot\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003efirst_child\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eunwrap\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis_doctype\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//both of them are not elements.\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eParsing a fragment\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nuse tendril::StrTendril;\n// fragment can be created with Document::fragment(), which accepts \u0026amp;str, String, StrTendril\nlet contents_str = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\u0026quot;#;\nlet fragment = Document::fragment(contents_str);\n\nlet contents_string = contents_str.to_string();\nlet fragment = Document::fragment(contents_string);\n\nlet contents_tendril = StrTendril::from(contents_str);\nlet fragment = Document::fragment(contents_tendril);\n\n// The root element for the fragment is not a Document but a Fragment\nassert!(!fragment.root().is_document());\nassert!(fragment.root().is_fragment());\n\n// and when it parses a fragment, it drops Doctype\nassert!(!fragment.root().first_child().unwrap().is_doctype());\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e tendril\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eStrTendril\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// fragment can be created with Document::fragment(), which accepts \u0026amp;str, String, StrTendril\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents_str = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e fragment = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efragment\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_str\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents_string = contents_str\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eto_string\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e fragment = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efragment\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_string\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents_tendril = \u003cspan class=\"pl-smi\"\u003eStrTendril\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_str\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e fragment = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efragment\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents_tendril\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// The root element for the fragment is not a Document but a Fragment\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!fragment\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eroot\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis_document\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003efragment\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eroot\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis_fragment\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// and when it parses a fragment, it drops Doctype\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!fragment\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eroot\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003efirst_child\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eunwrap\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis_doctype\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eSelecting elements\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nlet html = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\n \u0026lt;meta charset=\u0026quot;utf-8\u0026quot;\u0026gt;\n \u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\n \u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\n \u0026lt;ul\u0026gt;\n \u0026lt;li\u0026gt;One\u0026lt;/li\u0026gt;\n \u0026lt;li\u0026gt;\u0026lt;a href=\u0026quot;/2\u0026quot;\u0026gt;Two\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\n \u0026lt;li\u0026gt;\u0026lt;a href=\u0026quot;/3\u0026quot;\u0026gt;Three\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\n \u0026lt;/ul\u0026gt;\n \u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\nlet document = Document::from(html);\n// select a single element\nlet a = document.select(\u0026quot;ul li:nth-child(2)\u0026quot;);\nlet text = a.text().to_string();\nassert!(text == \u0026quot;Two\u0026quot;);\n// selecting multiple elements\ndocument.select(\u0026quot;ul \u0026gt; li:has(a)\u0026quot;).iter().for_each(|el| {\n assert!(el.is(\u0026quot;li\u0026quot;));\n})\n\n// there is also `try_select` which returns an Option\nlet no_sel = document.try_select(\u0026quot;p\u0026quot;);\nassert!(no_sel.is_none());\n\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;meta charset=\"utf-8\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;ul\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;One\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;\u0026lt;a href=\"/2\"\u0026gt;Two\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;\u0026lt;a href=\"/3\"\u0026gt;Three\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/ul\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e document = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// select a single element\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e a = document\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"ul li:nth-child(2)\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e text = a\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etext\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eto_string\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003etext == \u003cspan class=\"pl-s\"\u003e\"Two\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// selecting multiple elements\u003c/span\u003e\ndocument\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"ul \u0026gt; li:has(a)\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efor_each\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e|el| \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"li\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// there is also `try_select` which returns an Option\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e no_sel = document\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etry_select\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"p\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eno_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis_none\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eSelecting a single match and multiple matches\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nlet doc: Document = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html lang=\u0026quot;en\u0026quot;\u0026gt;\n\u0026lt;head\u0026gt;\u0026lt;/head\u0026gt;\n\u0026lt;body\u0026gt;\n \u0026lt;ul class=\u0026quot;list\u0026quot;\u0026gt;\n \u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\n \u0026lt;/ul\u0026gt;\n \u0026lt;ul class=\u0026quot;list\u0026quot;\u0026gt;\n \u0026lt;li\u0026gt;4\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;5\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;6\u0026lt;/li\u0026gt;\n \u0026lt;/ul\u0026gt;\n\u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#\n .into();\n// if you need to select only the first, single match, you can use following:\nlet single_selection = doc.select_single(\u0026quot;.list\u0026quot;);\n\n// access is only for the first matching:\nassert_eq!(single_selection.length(), 1);\nassert_eq!(single_selection.inner_html().to_string().trim(), \u0026quot;\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026quot;);\n\n// simple selection contains all matches:\nlet selection = doc.select(\u0026quot;.list\u0026quot;);\nassert_eq!(selection.length(), 2);\n\n// but if you call inner_html() on it, you will get the inner_html of the first match:\nassert_eq!(selection.inner_html().to_string().trim(), \u0026quot;\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026quot;);\n\n//this approach is using the first node from nodes vec and `select_single` consumes one iteration instead.\nlet first_selection = doc.select(\u0026quot;.list\u0026quot;).first();\nassert_eq!(first_selection.length(), 1);\nassert_eq!(first_selection.inner_html().to_string().trim(), \u0026quot;\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026quot;);\n\n// this approach is consuming all nodes into vec at first, and then you can call `iter().next()` to get the first one.\nlet next_selection = doc.select(\u0026quot;.list\u0026quot;).iter().next().unwrap();\nassert_eq!(next_selection.length(), 1);\nassert_eq!(next_selection.inner_html().to_string().trim(), \u0026quot;\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026quot;);\n\n// currently, to get data from all matches you need to iterate over them, either:\nlet all_matched: String = selection.iter().map(|s| s.inner_html().trim().to_string()).collect();\nassert_eq!(\nall_matched,\n\u0026quot;\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;4\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;5\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;6\u0026lt;/li\u0026gt;\u0026quot;\n);\n\n// or:\nlet all_matched: String = selection.nodes().iter().map(|s| s.inner_html().trim().to_string()).collect();\n/ which is more efficient.\nassert_eq!(\nall_matched,\n\u0026quot;\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;4\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;5\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;6\u0026lt;/li\u0026gt;\u0026quot;\n);\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html lang=\"en\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;head\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;ul class=\"list\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/ul\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;ul class=\"list\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;4\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;5\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;6\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/ul\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\n \u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einto\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// if you need to select only the first, single match, you can use following:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e single_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".list\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// access is only for the first matching:\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003esingle_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e1\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003esingle_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einner_html\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etrim\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// simple selection contains all matches:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".list\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eselection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e2\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// but if you call inner_html() on it, you will get the inner_html of the first match:\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eselection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einner_html\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etrim\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//this approach is using the first node from nodes vec and `select_single` consumes one iteration instead.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e first_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".list\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003efirst_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e1\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003efirst_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einner_html\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etrim\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// this approach is consuming all nodes into vec at first, and then you can call `iter().next()` to get the first one.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e next_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".list\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enext\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003enext_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e1\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003enext_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einner_html\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etrim\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// currently, to get data from all matches you need to iterate over them, either:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e all_matched\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eString\u003c/span\u003e = selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003emap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e|s| s\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einner_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etrim\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eto_string\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ecollect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\nall_matched\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\"\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;4\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;5\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;6\u0026lt;/li\u0026gt;\"\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// or:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e all_matched\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eString\u003c/span\u003e = selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003emap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e|s| s\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einner_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etrim\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eto_string\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ecollect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n/ which is more efficient\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\n\u003cspan class=\"pl-c1\"\u003eassert_eq\u003c/span\u003e!\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\nall_matched\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\"\u0026lt;li\u0026gt;1\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;2\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;3\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;4\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;5\u0026lt;/li\u0026gt;\u0026lt;li\u0026gt;6\u0026lt;/li\u0026gt;\"\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eSelecting descendent elements\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\" use dom_query::Document;\n\n let html = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n \u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\n \u0026lt;meta charset=\u0026quot;utf-8\u0026quot;\u0026gt;\n \u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\n \u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\n \u0026lt;ul class=\u0026quot;list-a\u0026quot;\u0026gt;\n \u0026lt;li\u0026gt;One\u0026lt;/li\u0026gt;\n \u0026lt;li\u0026gt;\u0026lt;a href=\u0026quot;/2\u0026quot;\u0026gt;Two\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\n \u0026lt;li\u0026gt;\u0026lt;a href=\u0026quot;/3\u0026quot;\u0026gt;Three\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\n \u0026lt;/ul\u0026gt;\n \u0026lt;ul class=\u0026quot;list-b\u0026quot;\u0026gt;\n \u0026lt;li\u0026gt;\u0026lt;a href=\u0026quot;/4\u0026quot;\u0026gt;Four\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\n \u0026lt;/ul\u0026gt;\n \u0026lt;/body\u0026gt;\n \u0026lt;/html\u0026gt;\u0026quot;#;\n let document = Document::from(html);\n // select a parent element\n let ul = document.select(\u0026quot;ul\u0026quot;);\n\n // selecting multiple elements\n ul.select(\u0026quot;li\u0026quot;).iter().for_each(|el| {\n assert!(el.is(\u0026quot;li\u0026quot;));\n });\n\n // also descendant selector may be specified starting from the parent elements\n let el = ul.select(\u0026quot;body ul.list-b li\u0026quot;).first();\n let text = el.text();\n assert_eq!(\u0026quot;Four\u0026quot;, text.to_string());\n\"\u003e\u003cpre\u003e \u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n \u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;meta charset=\"utf-8\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;title\u0026gt;Test Page\u0026lt;/title\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;ul class=\"list-a\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;One\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;\u0026lt;a href=\"/2\"\u0026gt;Two\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;\u0026lt;a href=\"/3\"\u0026gt;Three\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/ul\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;ul class=\"list-b\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;li\u0026gt;\u0026lt;a href=\"/4\"\u0026gt;Four\u0026lt;/a\u0026gt;\u0026lt;/li\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/ul\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n \u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e document = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n \u003cspan class=\"pl-c\"\u003e// select a parent element\u003c/span\u003e\n \u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e ul = document\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"ul\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n \u003cspan class=\"pl-c\"\u003e// selecting multiple elements\u003c/span\u003e\n ul\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"li\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efor_each\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e|el| \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"li\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n \u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n \u003cspan class=\"pl-c\"\u003e// also descendant selector may be specified starting from the parent elements\u003c/span\u003e\n \u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e el = ul\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"body ul.list-b li\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n \u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e text = el\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etext\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"Four\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e text\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eSelecting ancestors\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet doc: Document = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;Test\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;div id=\u0026quot;great-ancestor\u0026quot;\u0026gt;\n \u0026lt;div id=\u0026quot;grand-parent\u0026quot;\u0026gt;\n \u0026lt;div id=\u0026quot;parent\u0026quot;\u0026gt;\n \u0026lt;div id=\u0026quot;child\u0026quot;\u0026gt;Child\u0026lt;/div\u0026gt;\n \u0026lt;/div\u0026gt;\n \u0026lt;/div\u0026gt;\n \u0026lt;/div\u0026gt;\n \u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\n\u0026quot;#.into();\n\n// selecting an element\nlet child_sel = doc.select(\u0026quot;#child\u0026quot;);\nassert!(child_sel.exists());\n\nlet child_node = child_sel.nodes().first().unwrap();\n\n// getting all ancestors\nlet ancestors = child_node.ancestors(None);\n\nlet ancestor_sel = Selection::from(ancestors);\n\n// or just: let ancestor_sel = child_sel.ancestors(None);\n\n// in this case ancestors includes all ancestral nodes including html\n\n// the root html element is presented in the ancestor selection\nassert!(ancestor_sel.is(\u0026quot;html\u0026quot;));\n\n// also the direct parent of our starting node is presented\nassert!(ancestor_sel.is(\u0026quot;#parent\u0026quot;));\n\n// `Selection::is` matches only the current selection without descending down the tree,\n// so it won't match the #child node.\nassert!(!ancestor_sel.is(\u0026quot;#child\u0026quot;));\n\n\n// if you don't require all ancestors, you can specify a number of ancestors you need -- `max_limit`\nlet ancestors = child_node.ancestors(Some(2));\nlet ancestor_sel = Selection::from(ancestors);\n\n// in this case ancestors includes only two ancestral nodes: #grand-parent and #parent\nassert!(ancestor_sel.is(\u0026quot;#grand-parent #parent\u0026quot;));\n\nassert!(!ancestor_sel.is(\u0026quot;#great-ancestor\u0026quot;));\n\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;Test\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"great-ancestor\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"grand-parent\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"parent\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"child\"\u0026gt;Child\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einto\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// selecting an element\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e child_sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#child\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003echild_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e child_node = child_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// getting all ancestors\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e ancestors = child_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eancestors\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eNone\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e ancestor_sel = \u003cspan class=\"pl-smi\"\u003eSelection\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eancestors\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// or just: let ancestor_sel = child_sel.ancestors(None);\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// in this case ancestors includes all ancestral nodes including html\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// the root html element is presented in the ancestor selection\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eancestor_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"html\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// also the direct parent of our starting node is presented\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eancestor_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#parent\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// `Selection::is` matches only the current selection without descending down the tree,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// so it won't match the #child node.\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!ancestor_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#child\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\n\u003cspan class=\"pl-c\"\u003e// if you don't require all ancestors, you can specify a number of ancestors you need -- `max_limit`\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e ancestors = child_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eancestors\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eSome\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e2\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e ancestor_sel = \u003cspan class=\"pl-smi\"\u003eSelection\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eancestors\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// in this case ancestors includes only two ancestral nodes: #grand-parent and #parent\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eancestor_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#grand-parent #parent\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!ancestor_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#great-ancestor\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eSelecting with precompiled matchers (for reuse)\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::{Document, Matcher};\nlet html1 = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page 1\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\u0026quot;#;\nlet html2 = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page 2\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\u0026quot;#;\n\nlet doc1 = Document::from(html1);\nlet doc2 = Document::from(html2);\n// create a matcher once, reuse on different documents\nlet title_matcher = Matcher::new(\u0026quot;title\u0026quot;).unwrap();\n\nlet title_el1 = doc1.select_matcher(\u0026amp;title_matcher);\nassert_eq!(title_el1.text(), \u0026quot;Test Page 1\u0026quot;.into());\n\nlet title_el2 = doc2.select_matcher(\u0026amp;title_matcher);\nassert_eq!(title_el2.text(), \u0026quot;Test Page 2\u0026quot;.into());\n// selecting a single match\nlet title_single = doc1.select_single_matcher(\u0026amp;title_matcher);\nassert_eq!(title_single.text(), \u0026quot;Test Page 1\u0026quot;.into());\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-v\"\u003eMatcher\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html1 = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page 1\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html2 = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u0026lt;html\u0026gt;\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test Page 2\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u0026lt;body\u0026gt;\u0026lt;/body\u0026gt;\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc1 = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml1\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc2 = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml2\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// create a matcher once, reuse on different documents\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e title_matcher = \u003cspan class=\"pl-smi\"\u003eMatcher\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enew\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"title\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e title_el1 = doc1\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_matcher\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003etitle_matcher\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003etitle_el1\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Test Page 1\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e title_el2 = doc2\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_matcher\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003etitle_matcher\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003etitle_el2\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Test Page 2\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// selecting a single match\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e title_single = doc1\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single_matcher\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003etitle_matcher\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003etitle_single\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Test Page 1\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eSelecting with pseudo-classes (:has, :has-text, :contains, :only-text)\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet html = include_str!(\u0026quot;../test-pages/rustwiki_2024.html\u0026quot;);\nlet doc = Document::from(html);\n\n// searching list items inside a `tr` element which has a `a` element \n// with title=\u0026quot;Programming paradigm\u0026quot;\nlet paradigm_selection =\n doc.select(\n r#\u0026quot;table tr:has(a[title=\u0026quot;Programming paradigm\u0026quot;]) td.infobox-data ul \u0026gt; li\u0026quot;#\n );\n\nprintln!(\u0026quot;Rust programming paradigms:\u0026quot;);\nfor item in paradigm_selection.iter() {\n println!(\u0026quot; {}\u0026quot;, item.text());\n}\nprintln!(\u0026quot;{:-\u0026lt;50}\u0026quot;, \u0026quot;\u0026quot;);\n\n//since `th` contains text \u0026quot;Paradigms\u0026quot; without sibling tags, we can use `:has-text` pseudo class\nlet influenced_by_selection =\n doc.select(r#\u0026quot;table tr:has-text(\u0026quot;Influenced by\u0026quot;) + tr td ul \u0026gt; li \u0026gt; a\u0026quot;#);\n\nprintln!(\u0026quot;Rust influenced by:\u0026quot;);\nfor item in influenced_by_selection.iter() {\n println!(\u0026quot; {}\u0026quot;, item.text());\n}\nprintln!(\u0026quot;{:-\u0026lt;50}\u0026quot;, \u0026quot;\u0026quot;);\n\n// Extract all links from the block that contains certain text.\n// Since `foreign function interface` located in its own tag,\n// we have to use `:contains` pseudo class\nlet links_selection =\n doc.select(\n r#\u0026quot;p:contains(\u0026quot;Rust has a foreign function interface\u0026quot;) a[href^=\u0026quot;/\u0026quot;]\u0026quot;#\n );\n\nprintln!(\u0026quot;Links in the FFI block:\u0026quot;);\nfor item in links_selection.iter() {\n println!(\u0026quot; {}\u0026quot;, item.attr(\u0026quot;href\u0026quot;).unwrap());\n}\nprintln!(\u0026quot;{:-\u0026lt;50}\u0026quot;, \u0026quot;\u0026quot;);\n\n// :only-text selects an element that contains only a single text node,\n// with no child elements.\n// It can be combined with other pseudo-classes to achieve more specific selections.\n// For example, to select a \u0026lt;div\u0026gt; inside an \u0026lt;a\u0026gt; \n//that has no siblings and no child elements other than text.\nprintln!(\u0026quot;Single \u0026lt;div\u0026gt; inside an \u0026lt;a\u0026gt; with text only:\u0026quot;);\nfor el in doc.select(\u0026quot;a div:only-text:only-child\u0026quot;).iter() {\n println!(\u0026quot;{}\u0026quot;, el.text().trim());\n}\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-en\"\u003einclude_str\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"../test-pages/rustwiki_2024.html\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// searching list items inside a `tr` element which has a `a` element \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// with title=\"Programming paradigm\"\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e paradigm_selection =\n doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\n \u003cspan class=\"pl-s\"\u003er#\"table tr:has(a[title=\"Programming paradigm\"]) td.infobox-data ul \u0026gt; li\"#\u003c/span\u003e\n \u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"Rust programming paradigms:\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003efor\u003c/span\u003e item \u003cspan class=\"pl-k\"\u003ein\u003c/span\u003e paradigm_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\" {}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e item\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"{:-\u0026lt;50}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//since `th` contains text \"Paradigms\" without sibling tags, we can use `:has-text` pseudo class\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e influenced_by_selection =\n doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"table tr:has-text(\"Influenced by\") + tr td ul \u0026gt; li \u0026gt; a\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"Rust influenced by:\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003efor\u003c/span\u003e item \u003cspan class=\"pl-k\"\u003ein\u003c/span\u003e influenced_by_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\" {}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e item\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"{:-\u0026lt;50}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// Extract all links from the block that contains certain text.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// Since `foreign function interface` located in its own tag,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// we have to use `:contains` pseudo class\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e links_selection =\n doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\n \u003cspan class=\"pl-s\"\u003er#\"p:contains(\"Rust has a foreign function interface\") a[href^=\"/\"]\"#\u003c/span\u003e\n \u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"Links in the FFI block:\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003efor\u003c/span\u003e item \u003cspan class=\"pl-k\"\u003ein\u003c/span\u003e links_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\" {}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e item\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eattr\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"href\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eunwrap\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"{:-\u0026lt;50}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// :only-text selects an element that contains only a single text node,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// with no child elements.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// It can be combined with other pseudo-classes to achieve more specific selections.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// For example, to select a \u0026lt;div\u0026gt; inside an \u0026lt;a\u0026gt; \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e//that has no siblings and no child elements other than text.\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"Single \u0026lt;div\u0026gt; inside an \u0026lt;a\u0026gt; with text only:\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003efor\u003c/span\u003e el \u003cspan class=\"pl-k\"\u003ein\u003c/span\u003e doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"a div:only-text:only-child\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eiter\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-en\"\u003eprintln\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"{}\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e el\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etrim\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eSerializing to HTML\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nlet html = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\u0026lt;div class=\u0026quot;content\u0026quot;\u0026gt;\u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\nlet doc = Document::from(html);\nlet heading_selector = doc.select(\u0026quot;div.content\u0026quot;);\n// serializing including the outer html tag\nlet content = heading_selector.html();\nassert_eq!(content.to_string(), r#\u0026quot;\u0026lt;div class=\u0026quot;content\u0026quot;\u0026gt;\u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026quot;#);\n// serializing without the outer html tag\nlet inner_content = heading_selector.inner_html();\nassert_eq!(inner_content.to_string(), \u0026quot;\u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u0026quot;);\n\n// there is also `try_html()` method, which returns an `Option\u0026lt;StrTendril\u0026gt;`,\n// and if there is no matching selection it returns None\nlet opt_no_content = doc.select(\u0026quot;div.no-content\u0026quot;).try_html();\nassert_eq!(opt_no_content, None);\n\n//`html()` method will return an empty `StrTendril` if there is no matching selection\nlet no_content = doc.select(\u0026quot;div.no-content\u0026quot;).html();\nassert_eq!(no_content, \u0026quot;\u0026quot;.into());\n\n//Same things works for `inner_html()` and `try_inner_html()` method.\nassert_eq!(doc.select(\u0026quot;div.no-content\u0026quot;).try_inner_html(), None);\nassert_eq!(doc.select(\u0026quot;div.no-content\u0026quot;).inner_html(), \u0026quot;\u0026quot;.into());\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u0026lt;div class=\"content\"\u0026gt;\u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e heading_selector = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// serializing including the outer html tag\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e content = heading_selector\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ehtml\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtent\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;div class=\"content\"\u0026gt;\u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// serializing without the outer html tag\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e inner_content = heading_selector\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einner_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003einner_content\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\u0026lt;h1\u0026gt;Test Page\u0026lt;/h1\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// there is also `try_html()` method, which returns an `Option\u0026lt;StrTendril\u0026gt;`,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// and if there is no matching selection it returns None\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e opt_no_content = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.no-content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etry_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eopt_no_content\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-v\"\u003eNone\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//`html()` method will return an empty `StrTendril` if there is no matching selection\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e no_content = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.no-content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ehtml\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eno_content\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//Same things works for `inner_html()` and `try_inner_html()` method.\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.no-content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etry_inner_html\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-v\"\u003eNone\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.no-content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einner_html\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eAccessing descendent text\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet html = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\u0026lt;div\u0026gt;\u0026lt;h1\u0026gt;Test \u0026lt;span\u0026gt;Page\u0026lt;/span\u0026gt;\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\nlet doc = Document::from(html);\nlet body_selection = doc.select(\u0026quot;body div\u0026quot;).first();\nlet text = body_selection.text();\nassert_eq!(text.to_string(), \u0026quot;Test Page\u0026quot;);\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u0026lt;div\u0026gt;\u0026lt;h1\u0026gt;Test \u0026lt;span\u0026gt;Page\u0026lt;/span\u0026gt;\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e body_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"body div\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e text = body_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003etext\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Test Page\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eAccessing immediate text\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet html = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\u0026lt;div\u0026gt;\u0026lt;h1\u0026gt;Test \u0026lt;span\u0026gt;Page\u0026lt;/span\u0026gt;\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\n\nlet doc = Document::from(html);\n\nlet body_selection = doc.select(\u0026quot;body div h1\u0026quot;).first();\n// accessing immediate text without descendants\nlet text = body_selection.immediate_text();\nassert_eq!(text.to_string(), \u0026quot;Test \u0026quot;);\n\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u0026lt;div\u0026gt;\u0026lt;h1\u0026gt;Test \u0026lt;span\u0026gt;Page\u0026lt;/span\u0026gt;\u0026lt;/h1\u0026gt;\u0026lt;/div\u0026gt;\u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e body_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"body div h1\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// accessing immediate text without descendants\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e text = body_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eimmediate_text\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Test \"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n\u003csummary\u003e\u003cb\u003eManipulating the attribute of an HTML element\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nlet html = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\u0026lt;input hidden=\u0026quot;\u0026quot; id=\u0026quot;k\u0026quot; class=\u0026quot;important\u0026quot; type=\u0026quot;hidden\u0026quot; name=\u0026quot;k\u0026quot; data-k=\u0026quot;100\u0026quot;\u0026gt;\u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\n\nlet doc = Document::from(html);\nlet mut input_selection = doc.select(\u0026quot;input[name=k]\u0026quot;);\n\n// get the value of attribute \u0026quot;data-k\u0026quot;\nlet val = input_selection.attr(\u0026quot;data-k\u0026quot;).unwrap();\nassert_eq!(val.to_string(), \u0026quot;100\u0026quot;);\n\n// remove the attribute \u0026quot;data-k\u0026quot; from the element\ninput_selection.remove_attr(\u0026quot;data-k\u0026quot;);\n\n// get the value of attribute \u0026quot;data-k\u0026quot;, if missing, return default value\nlet val_or = input_selection.attr_or(\u0026quot;data-k\u0026quot;, \u0026quot;0\u0026quot;);\nassert_eq!(val_or.to_string(), \u0026quot;0\u0026quot;);\n\n// remove a list of attributes from the element\ninput_selection.remove_attrs(\u0026amp;[\u0026quot;id\u0026quot;, \u0026quot;class\u0026quot;]);\n// set a attribute \u0026quot;data-k\u0026quot; with value \u0026quot;200\u0026quot;\ninput_selection.set_attr(\u0026quot;data-k\u0026quot;, \u0026quot;200\u0026quot;);\n\nassert_eq!(input_selection.html(), r#\u0026quot;\u0026lt;input hidden=\u0026quot;\u0026quot; type=\u0026quot;hidden\u0026quot; name=\u0026quot;k\u0026quot; data-k=\u0026quot;200\u0026quot;\u0026gt;\u0026quot;#.into());\n\n// check if attribute \u0026quot;hidden\u0026quot; exists on the element\nlet is_hidden = input_selection.has_attr(\u0026quot;hidden\u0026quot;);\nassert!(is_hidden);\nlet has_title = input_selection.has_attr(\u0026quot;title\u0026quot;);\nassert!(!has_title);\n\n\n// remove all attributes from the element\ninput_selection.remove_all_attrs();\nassert_eq!(input_selection.html(), r#\u0026quot;\u0026lt;input\u0026gt;\u0026quot;#.into());\n\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u0026lt;input hidden=\"\" id=\"k\" class=\"important\" type=\"hidden\" name=\"k\" data-k=\"100\"\u0026gt;\u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e \u003cspan class=\"pl-k\"\u003emut\u003c/span\u003e input_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"input[name=k]\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// get the value of attribute \"data-k\"\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e val = input_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eattr\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"data-k\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eval\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"100\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// remove the attribute \"data-k\" from the element\u003c/span\u003e\ninput_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eremove_attr\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"data-k\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// get the value of attribute \"data-k\", if missing, return default value\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e val_or = input_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eattr_or\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"data-k\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"0\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eval_or\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eto_string\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"0\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// remove a list of attributes from the element\u003c/span\u003e\ninput_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eremove_attrs\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e[\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"id\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"class\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e]\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// set a attribute \"data-k\" with value \"200\"\u003c/span\u003e\ninput_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eset_attr\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"data-k\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"200\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003einput_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;input hidden=\"\" type=\"hidden\" name=\"k\" data-k=\"200\"\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// check if attribute \"hidden\" exists on the element\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e is_hidden = input_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ehas_attr\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"hidden\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eis_hidden\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e has_title = input_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ehas_attr\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"title\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!has_title\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\n\u003cspan class=\"pl-c\"\u003e// remove all attributes from the element\u003c/span\u003e\ninput_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eremove_all_attrs\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003einput_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;input\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eManipulating the DOM\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\nlet html_contents = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n \u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;div class=\u0026quot;content\u0026quot;\u0026gt;\n \u0026lt;/div\u0026gt;\n \u0026lt;div class=\u0026quot;remove-it\u0026quot;\u0026gt;\n Remove me\n \u0026lt;/div\u0026gt;\n \u0026lt;div class=\u0026quot;replace-it\u0026quot;\u0026gt;\n \u0026lt;div\u0026gt;Replace me\u0026lt;/div\u0026gt;\n \u0026lt;/div\u0026gt;\n \u0026lt;/body\u0026gt;\n \u0026lt;/html\u0026gt;\u0026quot;#;;\n\nlet doc = Document::from(html_contents);\n\nlet mut content_selection = doc.select(\u0026quot;body .content\u0026quot;);\n// append a new html node to the selection\ncontent_selection.append_html(r#\u0026quot;\u0026lt;div class=\u0026quot;inner\u0026quot;\u0026gt;inner block\u0026lt;/div\u0026gt;\u0026quot;#);\nassert!(doc.select(\u0026quot;body .content .inner\u0026quot;).exists());\n\n// set a new content to the selection, replacing existing content\nlet mut set_selection = doc.select(\u0026quot;.inner\u0026quot;);\nset_selection.set_html(r#\u0026quot;\u0026lt;p\u0026gt;1,2,3\u0026lt;/p\u0026gt;\u0026quot;#);\nassert_eq!(doc.select(\u0026quot;.inner\u0026quot;).html(), r#\u0026quot;\u0026lt;div class=\u0026quot;inner\u0026quot;\u0026gt;\u0026lt;p\u0026gt;1,2,3\u0026lt;/p\u0026gt;\u0026lt;/div\u0026gt;\u0026quot;#.into());\n\n// remove the selection\ndoc.select(\u0026quot;.remove-it\u0026quot;).remove();\nassert!(!doc.select(\u0026quot;.remove-it\u0026quot;).exists());\n\n// replace the selection with a new html, current selection will not change.\nlet mut replace_selection = doc.select(\u0026quot;.replace-it\u0026quot;);\nreplace_selection.replace_with_html(r#\u0026quot;\u0026lt;div class=\u0026quot;replaced\u0026quot;\u0026gt;Replaced\u0026lt;/div\u0026gt;\u0026quot;#);\nassert_eq!(replace_selection.text().trim(), \u0026quot;Replace me\u0026quot;);\n\n//but the document will change\nassert_eq!(doc.select(\u0026quot;.replaced\u0026quot;).text(),\u0026quot;Replaced\u0026quot;.into());\n\n//instead of appending content, you can prepend it\nlet mut content_selection = doc.select_single(\u0026quot;body .content\u0026quot;);\n// you can prepend one element or,\ncontent_selection.prepend_html(r#\u0026quot;\u0026lt;p class=\u0026quot;third\u0026quot;\u0026gt;3\u0026lt;/p\u0026gt;\u0026quot;#);\n// more:\ncontent_selection.prepend_html(r#\u0026quot;\u0026lt;p class=\u0026quot;first\u0026quot;\u0026gt;2\u0026lt;/p\u0026gt;\u0026lt;p class=\u0026quot;second\u0026quot;\u0026gt;2\u0026lt;/p\u0026gt;\u0026quot;#);\n\n// Also you can insert html before selection:\nlet first = content_selection.select(\u0026quot;.first\u0026quot;);\nfirst.before_html(r#\u0026quot;\u0026lt;p class=\u0026quot;none\u0026quot;\u0026gt;None\u0026lt;/p\u0026gt;\u0026quot;#);\n// or after:\nlet third = content_selection.select(\u0026quot;.third\u0026quot;);\nthird.after_html(r#\u0026quot;\u0026lt;p class=\u0026quot;fourth\u0026quot;\u0026gt;4\u0026lt;/p\u0026gt;\u0026quot;#);\n\n// now the added paragraphs standing in front of `div`\nassert!(doc.select(r#\u0026quot;.content \u0026gt; .none + .first + .second + .third + .fourth + div:has-text(\u0026quot;1,2,3\u0026quot;)\u0026quot;#).exists());\n\n// to set a text to the selection you can use `set_html` but `set_text` is preferable:\nlet p_sel = content_selection.select(\u0026quot;p\u0026quot;);\nlet total_p = p_sel.length();\np_sel.set_text(\u0026quot;test content\u0026quot;);\nassert_eq!(doc.select(r#\u0026quot;p:has-text(\u0026quot;test content\u0026quot;)\u0026quot;#).length(), total_p);\n\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e html_contents = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div class=\"content\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div class=\"remove-it\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e Remove me\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div class=\"replace-it\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div\u0026gt;Replace me\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ehtml_contents\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e \u003cspan class=\"pl-k\"\u003emut\u003c/span\u003e content_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"body .content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// append a new html node to the selection\u003c/span\u003e\ncontent_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eappend_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;div class=\"inner\"\u0026gt;inner block\u0026lt;/div\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"body .content .inner\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// set a new content to the selection, replacing existing content\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e \u003cspan class=\"pl-k\"\u003emut\u003c/span\u003e set_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".inner\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\nset_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eset_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p\u0026gt;1,2,3\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".inner\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003ehtml\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;div class=\"inner\"\u0026gt;\u0026lt;p\u0026gt;1,2,3\u0026lt;/p\u0026gt;\u0026lt;/div\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// remove the selection\u003c/span\u003e\ndoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".remove-it\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eremove\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".remove-it\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// replace the selection with a new html, current selection will not change.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e \u003cspan class=\"pl-k\"\u003emut\u003c/span\u003e replace_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".replace-it\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\nreplace_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ereplace_with_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;div class=\"replaced\"\u0026gt;Replaced\u0026lt;/div\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ereplace_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etrim\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Replace me\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//but the document will change\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".replaced\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"Replaced\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003einto\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e//instead of appending content, you can prepend it\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e \u003cspan class=\"pl-k\"\u003emut\u003c/span\u003e content_selection = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"body .content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// you can prepend one element or,\u003c/span\u003e\ncontent_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eprepend_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p class=\"third\"\u0026gt;3\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// more:\u003c/span\u003e\ncontent_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eprepend_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p class=\"first\"\u0026gt;2\u0026lt;/p\u0026gt;\u0026lt;p class=\"second\"\u0026gt;2\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// Also you can insert html before selection:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e first = content_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".first\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\nfirst\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ebefore_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p class=\"none\"\u0026gt;None\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// or after:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e third = content_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\".third\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\nthird\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eafter_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p class=\"fourth\"\u0026gt;4\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// now the added paragraphs standing in front of `div`\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\".content \u0026gt; .none + .first + .second + .third + .fourth + div:has-text(\"1,2,3\")\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// to set a text to the selection you can use `set_html` but `set_text` is preferable:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e p_sel = content_selection\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"p\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e total_p = p_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003elength\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\np_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eset_text\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"test content\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"p:has-text(\"test content\")\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e total_p\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eNode manipulations: Creating an empty element, adding a single element to a single node\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet doc: Document = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html lang=\u0026quot;en\u0026quot;\u0026gt;\n\u0026lt;head\u0026gt;\u0026lt;/head\u0026gt;\n\u0026lt;body\u0026gt;\n \u0026lt;div id=\u0026quot;main\u0026quot;\u0026gt;\n \u0026lt;p id=\u0026quot;first\u0026quot;\u0026gt;It's\u0026lt;/p\u0026gt;\n \u0026lt;/div\u0026gt;\n\u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#.into();\n\n// selecting a node we want to attach a new element\nlet main_sel = doc.select_single(\u0026quot;#main\u0026quot;);\nlet main_node = main_sel.nodes().first().unwrap();\n\n// if you need just to create a simple element, then you can use the following:\nlet el = doc.tree.new_element(\u0026quot;p\u0026quot;);\n// you still able to deal with element's attributes:\nel.set_attr(\u0026quot;id\u0026quot;, \u0026quot;second\u0026quot;);\n// and set text\nel.set_text(\u0026quot;test\u0026quot;);\nmain_node.append_child(\u0026amp;el);\n// also main_node.append_child(\u0026amp;el);\nassert!(doc.select(r#\u0026quot;#main #second:has-text(\u0026quot;test\u0026quot;)\u0026quot;#).exists());\n// because this method doesn't parse anything it is much more cheaper than following approaches.\n\n// if you need to add a more complex element, you can use `node.append_html`,\n// which is much more convenient, then previous approach:\n\nmain_node.append_html(r#\u0026quot;\u0026lt;p id=\u0026quot;third\u0026quot;\u0026gt;Wonderful\u0026lt;/p\u0026gt;\u0026quot;#);\nassert_eq!(doc.select(\u0026quot;#main #third\u0026quot;).text().as_ref(), \u0026quot;Wonderful\u0026quot;);\n// There is also a `prepend_child` and `prepend_html` methods which allows\n// to insert content to the begging of the node.\nmain_node.prepend_html(r#\u0026quot;\u0026lt;p id=\u0026quot;minus-one\u0026quot;\u0026gt;-1\u0026lt;/p\u0026gt;\u0026lt;p id=\u0026quot;zero\u0026quot;\u0026gt;0\u0026lt;/p\u0026gt;\u0026quot;#);\nassert!(doc.select(\u0026quot;#main \u0026gt; #minus-one + #zero + #first + #second + #third\u0026quot;).exists());\n\n// if we need to replace existing element content inside a node with a new one, then use `node.set_html`.\n// It changes the inner html contents of the node.\nmain_node.set_html(r#\u0026quot;\u0026lt;p id=\u0026quot;the-only\u0026quot;\u0026gt;Wonderful\u0026lt;/p\u0026gt;\u0026quot;#);\nassert_eq!(doc.select(\u0026quot;#main #the-only\u0026quot;).text().as_ref(), \u0026quot;Wonderful\u0026quot;);\nassert!(!doc.select(\u0026quot;#first\u0026quot;).exists());\n\n// To completely replace contents of the node, \n// including itself use `node.replace_with_html`.\n// Also we can specify more than one element in the string for methods \n// like `replace_with_html`, `set_html` and `append_html`.\nmain_node.replace_with_html(r#\u0026quot;\u0026lt;span\u0026gt;Tweedledum\u0026lt;/span\u0026gt; and \u0026lt;span\u0026gt;Tweedledee\u0026lt;/span\u0026gt;\u0026quot;#);\nassert!(!doc.select(\u0026quot;#main\u0026quot;).exists());\nassert_eq!(doc.select(\u0026quot;span + span\u0026quot;).text().as_ref(), \u0026quot;Tweedledee\u0026quot;);\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html lang=\"en\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;head\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"main\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;p id=\"first\"\u0026gt;It's\u0026lt;/p\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einto\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// selecting a node we want to attach a new element\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e main_sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e main_node = main_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// if you need just to create a simple element, then you can use the following:\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e el = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003etree\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enew_element\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"p\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// you still able to deal with element's attributes:\u003c/span\u003e\nel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eset_attr\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"id\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"second\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// and set text\u003c/span\u003e\nel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eset_text\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"test\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\nmain_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eappend_child\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003eel\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// also main_node.append_child(\u0026amp;el);\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"#main #second:has-text(\"test\")\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// because this method doesn't parse anything it is much more cheaper than following approaches.\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// if you need to add a more complex element, you can use `node.append_html`,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// which is much more convenient, then previous approach:\u003c/span\u003e\n\nmain_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eappend_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p id=\"third\"\u0026gt;Wonderful\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main #third\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Wonderful\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// There is also a `prepend_child` and `prepend_html` methods which allows\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// to insert content to the begging of the node.\u003c/span\u003e\nmain_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eprepend_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p id=\"minus-one\"\u0026gt;-1\u0026lt;/p\u0026gt;\u0026lt;p id=\"zero\"\u0026gt;0\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main \u0026gt; #minus-one + #zero + #first + #second + #third\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// if we need to replace existing element content inside a node with a new one, then use `node.set_html`.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// It changes the inner html contents of the node.\u003c/span\u003e\nmain_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eset_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;p id=\"the-only\"\u0026gt;Wonderful\u0026lt;/p\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main #the-only\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Wonderful\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#first\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// To completely replace contents of the node, \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// including itself use `node.replace_with_html`.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// Also we can specify more than one element in the string for methods \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// like `replace_with_html`, `set_html` and `append_html`.\u003c/span\u003e\nmain_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ereplace_with_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;span\u0026gt;Tweedledum\u0026lt;/span\u0026gt; and \u0026lt;span\u0026gt;Tweedledee\u0026lt;/span\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eexists\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"span + span\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003etext\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"Tweedledee\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eRenaming selected elements without changing the contents\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet doc: Document = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n\u0026lt;body\u0026gt;\n \u0026lt;div class=\u0026quot;content\u0026quot;\u0026gt;\n \u0026lt;div\u0026gt;1\u0026lt;/div\u0026gt;\n \u0026lt;div\u0026gt;2\u0026lt;/div\u0026gt;\n \u0026lt;div\u0026gt;3\u0026lt;/div\u0026gt;\n \u0026lt;span\u0026gt;4\u0026lt;/span\u0026gt;\n \u0026lt;/div\u0026gt;\n\u0026lt;body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#\n.into();\nlet mut sel = doc.select(\u0026quot;div.content \u0026gt; div, div.content \u0026gt; span\u0026quot;);\n// before renaming, there are 3 `div` and 1 `span`\nassert_eq!(sel.length(), 4);\n\nsel.rename(\u0026quot;p\u0026quot;);\n\n// after renaming, there are no `div` and `span` elements\nassert_eq!(doc.select(\u0026quot;div.content \u0026gt; div, div.content \u0026gt; span\u0026quot;).length(), 0);\n// but there are four `p` elements\nassert_eq!(doc.select(\u0026quot;div.content \u0026gt; p\u0026quot;).length(), 4);\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div class=\"content\"\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div\u0026gt;1\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div\u0026gt;2\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div\u0026gt;3\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;span\u0026gt;4\u0026lt;/span\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einto\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e \u003cspan class=\"pl-k\"\u003emut\u003c/span\u003e sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.content \u0026gt; div, div.content \u0026gt; span\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// before renaming, there are 3 `div` and 1 `span`\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003esel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e4\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\nsel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003erename\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"p\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// after renaming, there are no `div` and `span` elements\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.content \u0026gt; div, div.content \u0026gt; span\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e0\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// but there are four `p` elements\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003edoc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eselect\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div.content \u0026gt; p\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003elength\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e4\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eRetrieving The Base URI\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet contents: \u0026amp;str = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\n \u0026lt;base href=\u0026quot;https://www.example.com/\u0026quot;/\u0026gt;\n \u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\n \u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;div id=\u0026quot;main\u0026quot;\u0026gt;\u0026lt;/div\u0026gt;\n \u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\nlet doc = Document::from(contents);\n// This method is a much faster alternative to \n// `doc.select(\u0026quot;html \u0026gt; head \u0026gt; base\u0026quot;).attr(\u0026quot;href\u0026quot;)`.\n// Currently, it does not cache the result, so each time you call it, \n// it will traverse the tree again.\n// The reason it is not cached is to keep `Document` implementing the `Send` trait.\n\n// It may be called from the document level.\nlet base_uri = doc.base_uri().unwrap();\nassert_eq!(base_uri.as_ref(), \u0026quot;https://www.example.com/\u0026quot;);\n\nlet sel = doc.select_single(\u0026quot;#main\u0026quot;);\nlet node = sel.nodes().first().unwrap();\n\n// Also it is accessible from any node of the tree.\nlet base_uri = node.base_uri().unwrap();\nassert_eq!(base_uri.as_ref(), \u0026quot;https://www.example.com/\u0026quot;);\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003e\u003cspan class=\"pl-smi\"\u003estr\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;base href=\"https://www.example.com/\"/\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"main\"\u0026gt;\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// This method is a much faster alternative to \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// `doc.select(\"html \u0026gt; head \u0026gt; base\").attr(\"href\")`.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// Currently, it does not cache the result, so each time you call it, \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// it will traverse the tree again.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// The reason it is not cached is to keep `Document` implementing the `Send` trait.\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// It may be called from the document level.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e base_uri = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ebase_uri\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ebase_uri\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"https://www.example.com/\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e node = sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// Also it is accessible from any node of the tree.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e base_uri = node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003ebase_uri\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003ebase_uri\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"https://www.example.com/\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eVerifying Selection and Node Matches\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet contents: \u0026amp;str = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\n \u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\n \u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;div id=\u0026quot;main\u0026quot; dir=\u0026quot;ltr\u0026quot;\u0026gt;\u0026lt;/div\u0026gt;\n \u0026lt;div id=\u0026quot;extra\u0026quot;\u0026gt;\u0026lt;/div\u0026gt;\n \u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#;\nlet doc = Document::from(contents);\n\nlet main_sel = doc.select_single(\u0026quot;#main\u0026quot;);\nlet extra_sel = doc.select_single(\u0026quot;#extra\u0026quot;);\n\n// The `is()` method is available for `Selection` and `NodeRef`.\n// For `Selection`, it verifies that at least one of the nodes in the selection\n// matches the selector.\nassert!(main_sel.is(\u0026quot;div#main\u0026quot;));\nassert!(!extra_sel.is(\u0026quot;div#main\u0026quot;));\n\n// For `NodeRef`, the `is` method verifies that the node matches the selector.\n// This method is useful if you need to combine several checks into one expression. \n// It can check for having a certain position in the DOM tree,\n// having a certain attribute, or a certain element name all at once.\nlet main_node = main_sel.nodes().first().unwrap();\nlet extra_node = extra_sel.nodes().first().unwrap();\n\nassert!(main_node.is(\u0026quot;html \u0026gt; body \u0026gt; div#main[dir=ltr]\u0026quot;));\nassert!(extra_node.is(\u0026quot;html \u0026gt; body \u0026gt; div#main + div\u0026quot;));\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003e\u003cspan class=\"pl-smi\"\u003estr\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"main\" dir=\"ltr\"\u0026gt;\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"extra\"\u0026gt;\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e main_sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e extra_sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#extra\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// The `is()` method is available for `Selection` and `NodeRef`.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// For `Selection`, it verifies that at least one of the nodes in the selection\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// matches the selector.\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003emain_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e!extra_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// For `NodeRef`, the `is` method verifies that the node matches the selector.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// This method is useful if you need to combine several checks into one expression. \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// It can check for having a certain position in the DOM tree,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// having a certain attribute, or a certain element name all at once.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e main_node = main_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e extra_node = extra_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003emain_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"html \u0026gt; body \u0026gt; div#main[dir=ltr]\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eextra_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eis\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"html \u0026gt; body \u0026gt; div#main + div\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eFast Finding Child Elements\u003c/b\u003e\u003c/summary\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet doc: Document = r#\u0026quot;\u0026lt;!DOCTYPE html\u0026gt;\n\u0026lt;html\u0026gt;\n \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\n \u0026lt;body\u0026gt;\n \u0026lt;div id=\u0026quot;main\u0026quot;\u0026gt;\u0026lt;/div\u0026gt;\n \u0026lt;/body\u0026gt;\n\u0026lt;/html\u0026gt;\u0026quot;#.into();\n\nlet main_sel = doc.select_single(\u0026quot;#main\u0026quot;);\nlet main_node = main_sel.nodes().first().unwrap();\n\n// create 10 child blocks with links\nlet total_links = 10usize;\nfor i in 0..total_links {\n let content = format!(r#\u0026quot;\u0026lt;div\u0026gt;\u0026lt;a href=\u0026quot;/{0}\u0026quot;\u0026gt;{0} link\u0026lt;/a\u0026gt;\u0026lt;/div\u0026gt;\u0026quot;#, i);\n main_node.append_html(content);\n}\nlet selected_count = doc.select(\u0026quot;html body a\u0026quot;).nodes().len();\nassert_eq!(selected_count, total_links);\n\n// `find` currently can deal only with paths that start after the current node. \n// In the following example, `\u0026amp;[\u0026quot;html\u0026quot;, \u0026quot;body\u0026quot;, \u0026quot;div\u0026quot;, \u0026quot;a\u0026quot;]` will fail,\n// while `\u0026amp;[\u0026quot;a\u0026quot;]` or `\u0026amp;[\u0026quot;div\u0026quot;, \u0026quot;a\u0026quot;]` are okay.\nlet found_count = main_node.find(\u0026amp;[\u0026quot;div\u0026quot;, \u0026quot;a\u0026quot;]).len();\nassert_eq!(found_count, total_links);\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc\u003cspan class=\"pl-kos\"\u003e:\u003c/span\u003e \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e = \u003cspan class=\"pl-s\"\u003er#\"\u0026lt;!DOCTYPE html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;html\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;head\u0026gt;\u0026lt;title\u0026gt;Test\u0026lt;/title\u0026gt;\u0026lt;/head\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;div id=\"main\"\u0026gt;\u0026lt;/div\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e \u0026lt;/body\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;/html\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003einto\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e main_sel = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect_single\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"#main\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e main_node = main_sel\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efirst\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eunwrap\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// create 10 child blocks with links\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e total_links = \u003cspan class=\"pl-c1\"\u003e10usize\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003efor\u003c/span\u003e i \u003cspan class=\"pl-k\"\u003ein\u003c/span\u003e \u003cspan class=\"pl-c1\"\u003e0\u003c/span\u003e..total_links \u003cspan class=\"pl-kos\"\u003e{\u003c/span\u003e\n \u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e content = \u003cspan class=\"pl-en\"\u003eformat\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003er#\"\u0026lt;div\u0026gt;\u0026lt;a href=\"/{0}\"\u0026gt;{0} link\u0026lt;/a\u0026gt;\u0026lt;/div\u0026gt;\"#\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e i\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n main_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eappend_html\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtent\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-kos\"\u003e}\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e selected_count = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eselect\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"html body a\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003enodes\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003elen\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003eselected_count\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e total_links\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// `find` currently can deal only with paths that start after the current node. \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// In the following example, `\u0026amp;[\"html\", \"body\", \"div\", \"a\"]` will fail,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// while `\u0026amp;[\"a\"]` or `\u0026amp;[\"div\", \"a\"]` are okay.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e found_count = main_node\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efind\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e[\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e \u003cspan class=\"pl-s\"\u003e\"a\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e]\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003elen\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003efound_count\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e total_links\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cdetails\u003e\n \u003csummary\u003e\u003cb\u003eSerializing a document to Markdown\u003c/b\u003e\u003c/summary\u003e\n\u003cp dir=\"auto\"\u003e\u003cem\u003eThis example requires \u003ccode\u003emarkdown\u003c/code\u003e feature.\u003c/em\u003e\u003c/p\u003e\n\u003cdiv class=\"highlight highlight-source-rust notranslate position-relative overflow-auto\" dir=\"auto\" data-snippet-clipboard-copy-content=\"use dom_query::Document;\n\nlet contents = \u0026quot;\n\u0026lt;style\u0026gt;p {color: blue;}\u0026lt;/style\u0026gt;\n\u0026lt;p\u0026gt;I really like using \u0026lt;b\u0026gt;Markdown\u0026lt;/b\u0026gt;.\u0026lt;/p\u0026gt;\n\n\u0026lt;p\u0026gt;I think I'll use it to format all of my documents from now on.\u0026lt;/p\u0026gt;\u0026quot;;\n\nlet expected = \u0026quot;I really like using **Markdown**\\\\.\\n\\n\\\nI think I'll use it to format all of my documents from now on\\\\.\u0026quot;;\n\nlet doc = Document::from(contents);\n// Passing `None` into md allows to use default skip tags, which are: \n// `[\u0026quot;script\u0026quot;, \u0026quot;style\u0026quot;, \u0026quot;meta\u0026quot;, \u0026quot;head\u0026quot;]`.\nlet got = doc.md(None);\nassert_eq!(got.as_ref(), expected);\n\n// If you need the full text content of the elements, pass `Some(\u0026amp;vec![])` to `md`.\n// If you pass content like the example below to `Document::from`,\n// `html5ever` will create a `\u0026lt;head\u0026gt;` element and place your `\u0026lt;style\u0026gt;` element inside it.\n// To preserve the original order, use `Document::fragment`.\n\nlet contents = \u0026quot;\u0026lt;style\u0026gt;p {color: blue;}\u0026lt;/style\u0026gt;\\\n\u0026lt;div\u0026gt;\u0026lt;h1\u0026gt;Content Heading\u0026lt;h1\u0026gt;\u0026lt;/div\u0026gt;\\\n\u0026lt;p\u0026gt;I really like using Markdown.\u0026lt;/p\u0026gt;\\\n\u0026lt;p\u0026gt;I think I'll use it to format all of my documents from now on.\u0026lt;/p\u0026gt;\u0026quot;;\n\nlet expected = \u0026quot;p \\\\{color: blue;\\\\}\\n\\\nI really like using Markdown\\\\.\\n\\n\\\nI think I'll use it to format all of my documents from now on\\\\.\u0026quot;;\n\nlet doc = Document::fragment(contents);\nlet got = doc.md(Some(\u0026amp;[\u0026quot;div\u0026quot;]));\nassert_eq!(got.as_ref(), expected);\n\"\u003e\u003cpre\u003e\u003cspan class=\"pl-k\"\u003euse\u003c/span\u003e dom_query\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents = \u003cspan class=\"pl-s\"\u003e\"\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;style\u0026gt;p {color: blue;}\u0026lt;/style\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;p\u0026gt;I really like using \u0026lt;b\u0026gt;Markdown\u0026lt;/b\u0026gt;.\u0026lt;/p\u0026gt;\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u0026lt;p\u0026gt;I think I'll use it to format all of my documents from now on.\u0026lt;/p\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e expected = \u003cspan class=\"pl-s\"\u003e\"I really like using **Markdown**\u003cspan class=\"pl-cce\"\u003e\\\\\u003c/span\u003e.\u003cspan class=\"pl-cce\"\u003e\\n\u003c/span\u003e\u003cspan class=\"pl-cce\"\u003e\\n\u003c/span\u003e\u003cspan class=\"pl-cce\"\u003e\\\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003cspan class=\"pl-cce\"\u003e\u003c/span\u003eI think I'll use it to format all of my documents from now on\u003cspan class=\"pl-cce\"\u003e\\\\\u003c/span\u003e.\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efrom\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// Passing `None` into md allows to use default skip tags, which are: \u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// `[\"script\", \"style\", \"meta\", \"head\"]`.\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e got = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003emd\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-v\"\u003eNone\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003egot\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e expected\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-c\"\u003e// If you need the full text content of the elements, pass `Some(\u0026amp;vec![])` to `md`.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// If you pass content like the example below to `Document::from`,\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// `html5ever` will create a `\u0026lt;head\u0026gt;` element and place your `\u0026lt;style\u0026gt;` element inside it.\u003c/span\u003e\n\u003cspan class=\"pl-c\"\u003e// To preserve the original order, use `Document::fragment`.\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e contents = \u003cspan class=\"pl-s\"\u003e\"\u0026lt;style\u0026gt;p {color: blue;}\u0026lt;/style\u0026gt;\u003cspan class=\"pl-cce\"\u003e\\\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003cspan class=\"pl-cce\"\u003e\u003c/span\u003e\u0026lt;div\u0026gt;\u0026lt;h1\u0026gt;Content Heading\u0026lt;h1\u0026gt;\u0026lt;/div\u0026gt;\u003cspan class=\"pl-cce\"\u003e\\\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003cspan class=\"pl-cce\"\u003e\u003c/span\u003e\u0026lt;p\u0026gt;I really like using Markdown.\u0026lt;/p\u0026gt;\u003cspan class=\"pl-cce\"\u003e\\\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003cspan class=\"pl-cce\"\u003e\u003c/span\u003e\u0026lt;p\u0026gt;I think I'll use it to format all of my documents from now on.\u0026lt;/p\u0026gt;\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e expected = \u003cspan class=\"pl-s\"\u003e\"p \u003cspan class=\"pl-cce\"\u003e\\\\\u003c/span\u003e{color: blue;\u003cspan class=\"pl-cce\"\u003e\\\\\u003c/span\u003e}\u003cspan class=\"pl-cce\"\u003e\\n\u003c/span\u003e\u003cspan class=\"pl-cce\"\u003e\\\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003cspan class=\"pl-cce\"\u003e\u003c/span\u003eI really like using Markdown\u003cspan class=\"pl-cce\"\u003e\\\\\u003c/span\u003e.\u003cspan class=\"pl-cce\"\u003e\\n\u003c/span\u003e\u003cspan class=\"pl-cce\"\u003e\\n\u003c/span\u003e\u003cspan class=\"pl-cce\"\u003e\\\u003c/span\u003e\u003c/span\u003e\n\u003cspan class=\"pl-s\"\u003e\u003cspan class=\"pl-cce\"\u003e\u003c/span\u003eI think I'll use it to format all of my documents from now on\u003cspan class=\"pl-cce\"\u003e\\\\\u003c/span\u003e.\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e doc = \u003cspan class=\"pl-smi\"\u003eDocument\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e::\u003c/span\u003e\u003cspan class=\"pl-en\"\u003efragment\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003econtents\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-k\"\u003elet\u003c/span\u003e got = doc\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003e\u003cspan class=\"pl-en\"\u003emd\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-en\"\u003eSome\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-c1\"\u003e\u0026amp;\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e[\u003c/span\u003e\u003cspan class=\"pl-s\"\u003e\"div\"\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e]\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\n\u003cspan class=\"pl-en\"\u003eassert_eq\u003c/span\u003e\u003cspan class=\"pl-en\"\u003e!\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003egot\u003cspan class=\"pl-kos\"\u003e.\u003c/span\u003eas_ref\u003cspan class=\"pl-kos\"\u003e(\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e,\u003c/span\u003e expected\u003cspan class=\"pl-kos\"\u003e)\u003c/span\u003e\u003cspan class=\"pl-kos\"\u003e;\u003c/span\u003e\u003c/pre\u003e\u003c/div\u003e\n\u003c/details\u003e\n\u003cul dir=\"auto\"\u003e\n\u003cli\u003e\u003cstrong\u003e\u003ca href=\"/niklak/dom_query/blob/main/examples\"\u003emore examples\u003c/a\u003e\u003c/strong\u003e\u003c/li\u003e\n\u003cli\u003e\u003cstrong\u003e\u003ca href=\"https://niklak.github.io/dom_query_by_example/\" rel=\"nofollow\"\u003edom_query by example\u003c/a\u003e\u003c/strong\u003e\u003c/li\u003e\n\u003c/ul\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eRelated projects\u003c/h2\u003e\u003ca id=\"user-content-related-projects\" class=\"anchor\" aria-label=\"Permalink: Related projects\" href=\"#related-projects\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cul dir=\"auto\"\u003e\n\u003cli\u003e\u003ca href=\"https://crates.io/crates/html5ever\" rel=\"nofollow\"\u003ehtml5ever\u003c/a\u003e\u003c/li\u003e\n\u003cli\u003e\u003ca href=\"https://crates.io/crates/selectors\" rel=\"nofollow\"\u003eselectors\u003c/a\u003e\u003c/li\u003e\n\u003cli\u003e\u003ca href=\"https://crates.io/crates/select\" rel=\"nofollow\"\u003eselect.rs\u003c/a\u003e\u003c/li\u003e\n\u003cli\u003e\u003ca href=\"https://godoc.org/github.com/PuerkitoBio/goquery\" rel=\"nofollow\"\u003egoquery\u003c/a\u003e\u003c/li\u003e\n\u003cli\u003e\u003ca href=\"https://crates.io/crates/dom_finder\" rel=\"nofollow\"\u003edom_finder\u003c/a\u003e\u003c/li\u003e\n\u003c/ul\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eCrate features\u003c/h2\u003e\u003ca id=\"user-content-crate-features\" class=\"anchor\" aria-label=\"Permalink: Crate features\" href=\"#crate-features\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cul dir=\"auto\"\u003e\n\u003cli\u003e\u003ccode\u003ehashbrown\u003c/code\u003e — optional,replaces standard hashmaps and hashsets with \u003ccode\u003ehashbrown\u003c/code\u003e hashmaps and hashsets.\u003c/li\u003e\n\u003cli\u003e\u003ccode\u003eatomic\u003c/code\u003e — optional, switches \u003ccode\u003eNodeData\u003c/code\u003e from using \u003ccode\u003eStrTendril\u003c/code\u003e to \u003ccode\u003eTendril\u0026lt;tendril::fmt::UTF8, tendril::Atomic\u0026gt;\u003c/code\u003e.\nThis allows \u003ccode\u003eNodeData\u003c/code\u003e and all ascending structures, including \u003ccode\u003eDocument\u003c/code\u003e, to implement the \u003ccode\u003eSend\u003c/code\u003e trait;\u003c/li\u003e\n\u003cli\u003e\u003ccode\u003emarkdown\u003c/code\u003e — optional, enables the \u003ccode\u003eDocument::md\u003c/code\u003e and \u003ccode\u003eNodeRef::md\u003c/code\u003e methods, allowing serialization of a document or node to \u003ccode\u003eMarkdown\u003c/code\u003e text.\u003c/li\u003e\n\u003cli\u003e\u003ccode\u003emini_selector\u003c/code\u003e — optional, provides a lightweight and faster alternative for element matching with limited CSS selector support.\u003cbr\u003e\nThis includes additional \u003ccode\u003eNodeRef\u003c/code\u003e methods: \u003ccode\u003efind_descendants\u003c/code\u003e, \u003ccode\u003etry_find_descendants\u003c/code\u003e, \u003ccode\u003emini_is\u003c/code\u003e, and \u003ccode\u003emini_match\u003c/code\u003e.\u003cbr\u003e\n\u003cem\u003eThis is an experimental feature that may change in future releases.\u003c/em\u003e\u003c/li\u003e\n\u003c/ul\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003ePossible issues\u003c/h2\u003e\u003ca id=\"user-content-possible-issues\" class=\"anchor\" aria-label=\"Permalink: Possible issues\" href=\"#possible-issues\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cul dir=\"auto\"\u003e\n\u003cli\u003e\u003ca href=\"https://niklak.github.io/dom_query_by_example/WASM32-compilation.html\" rel=\"nofollow\"\u003ewasm32 compilation\u003c/a\u003e\u003c/li\u003e\n\u003c/ul\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eChangelog\u003c/h2\u003e\u003ca id=\"user-content-changelog\" class=\"anchor\" aria-label=\"Permalink: Changelog\" href=\"#changelog\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cp dir=\"auto\"\u003e\u003ca href=\"/niklak/dom_query/blob/main/CHANGELOG.md\"\u003eChangelog\u003c/a\u003e\u003c/p\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eLicense\u003c/h2\u003e\u003ca id=\"user-content-license\" class=\"anchor\" aria-label=\"Permalink: License\" href=\"#license\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cp dir=\"auto\"\u003eLicensed under MIT (\u003ca href=\"/niklak/dom_query/blob/main/LICENSE\"\u003eLICENSE\u003c/a\u003e or \u003ca href=\"http://opensource.org/licenses/MIT\" rel=\"nofollow\"\u003ehttp://opensource.org/licenses/MIT\u003c/a\u003e)\u003c/p\u003e\n\u003cdiv class=\"markdown-heading\" dir=\"auto\"\u003e\u003ch2 tabindex=\"-1\" class=\"heading-element\" dir=\"auto\"\u003eContribution\u003c/h2\u003e\u003ca id=\"user-content-contribution\" class=\"anchor\" aria-label=\"Permalink: Contribution\" href=\"#contribution\"\u003e\u003csvg class=\"octicon octicon-link\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"16\" height=\"16\" aria-hidden=\"true\"\u003e\u003cpath d=\"m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z\"\u003e\u003c/path\u003e\u003c/svg\u003e\u003c/a\u003e\u003c/div\u003e\n\u003cp dir=\"auto\"\u003eAny contribution intentionally submitted for inclusion in the work by you, shall be\nlicensed with MIT license, without any additional terms or conditions.\u003c/p\u003e\n\u003c/article\u003e","loaded":true,"timedOut":false,"errorMessage":null,"headerInfo":{"toc":[{"level":1,"text":"DOM_QUERY: A Flexible Rust Crate for DOM Querying and Manipulation","anchor":"dom_query-a-flexible-rust-crate-for-dom-querying-and-manipulation","htmlText":"DOM_QUERY: A Flexible Rust Crate for DOM Querying and Manipulation"},{"level":2,"text":"Features","anchor":"features","htmlText":"Features"},{"level":2,"text":"Examples","anchor":"examples","htmlText":"Examples"},{"level":2,"text":"Related projects","anchor":"related-projects","htmlText":"Related projects"},{"level":2,"text":"Crate features","anchor":"crate-features","htmlText":"Crate features"},{"level":2,"text":"Possible issues","anchor":"possible-issues","htmlText":"Possible issues"},{"level":2,"text":"Changelog","anchor":"changelog","htmlText":"Changelog"},{"level":2,"text":"License","anchor":"license","htmlText":"License"},{"level":2,"text":"Contribution","anchor":"contribution","htmlText":"Contribution"}],"siteNavLoginPath":"/login?return_to=https%3A%2F%2Fgithub.com%2Fniklak%2Fdom_query"}},{"displayName":"LICENSE","repoName":"dom_query","refName":"main","path":"LICENSE","preferredFileType":"license","tabName":"MIT","richText":null,"loaded":false,"timedOut":false,"errorMessage":null,"headerInfo":{"toc":null,"siteNavLoginPath":"/login?return_to=https%3A%2F%2Fgithub.com%2Fniklak%2Fdom_query"}}],"overviewFilesProcessingTime":0}},"appPayload":{"helpUrl":"https://docs.github.com","findFileWorkerPath":"/assets-cdn/worker/find-file-worker-7d7eb7c71814.js","findInFileWorkerPath":"/assets-cdn/worker/find-in-file-worker-96e76d5fdb2c.js","githubDevUrl":null,"enabled_features":{"copilot_workspace":null,"code_nav_ui_events":false,"overview_shared_code_dropdown_button":false,"react_blob_overlay":false,"accessible_code_button":true,"github_models_repo_integration":false}}}}</script> <div data-target="react-partial.reactRoot"><style data-styled="true" data-styled-version="5.3.11">.iVEunk{margin-top:16px;margin-bottom:16px;}/*!sc*/ .jzuOtQ{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}/*!sc*/ .bGojzy{margin-bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:16px;}/*!sc*/ .iNSVHo{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding-bottom:16px;padding-top:8px;}/*!sc*/ .bVgnfw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;gap:8px;}/*!sc*/ @media screen and (max-width:320px){.bVgnfw{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}}/*!sc*/ .CEgMp{position:relative;}/*!sc*/ @media screen and (max-width:380px){.CEgMp .ref-selector-button-text-container{max-width:80px;}}/*!sc*/ @media screen and (max-width:320px){.CEgMp{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}.CEgMp .overview-ref-selector{width:100%;}.CEgMp .overview-ref-selector > span{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;}.CEgMp .overview-ref-selector > span > span[data-component="text"]{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}}/*!sc*/ .gMOVLe[data-size="medium"]{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-width:0;}/*!sc*/ .gMOVLe[data-size="medium"] svg{color:var(--fgColor-muted,var(--color-fg-muted,#656d76));}/*!sc*/ .gMOVLe[data-size="medium"] > span{width:inherit;}/*!sc*/ .gUkoLg{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}/*!sc*/ .bZBlpz{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;}/*!sc*/ .lhTYNA{margin-right:4px;color:var(--fgColor-muted,var(--color-fg-muted,#656d76));}/*!sc*/ .ffLUq{font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}/*!sc*/ .bmcJak{min-width:0;}/*!sc*/ .fLXEGX{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}/*!sc*/ @media screen and (max-width:1079px){.fLXEGX{display:none;}}/*!sc*/ .lmSMZJ[data-size="medium"]{color:var(--fgColor-muted,var(--color-fg-muted,#656d76));padding-left:4px;padding-right:4px;}/*!sc*/ .lmSMZJ[data-size="medium"] span[data-component="leadingVisual"]{margin-right:4px !important;}/*!sc*/ .dqfxud{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}/*!sc*/ @media screen and (min-width:1080px){.dqfxud{display:none;}}/*!sc*/ @media screen and (max-width:543px){.dqfxud{display:none;}}/*!sc*/ .fGwBZA[data-size="medium"][data-no-visuals]{color:var(--fgColor-muted,var(--color-fg-muted,#656d76));}/*!sc*/ .jxTzTd{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-left:8px;gap:8px;}/*!sc*/ .gqqBXN{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:8px;}/*!sc*/ @media screen and (max-width:543px){.gqqBXN{display:none;}}/*!sc*/ .dzXgxt{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}/*!sc*/ @media screen and (max-width:1011px){.dzXgxt{display:none;}}/*!sc*/ .iWFGlI{margin-left:8px;margin-right:8px;margin:0;}/*!sc*/ .vcvyP{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-width:160px;}/*!sc*/ .YUPas{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}/*!sc*/ @media screen and (min-width:1012px){.YUPas{display:none;}}/*!sc*/ .izFOf{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}/*!sc*/ @media screen and (min-width:544px){.izFOf{display:none;}}/*!sc*/ .vIPPs{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:16px;}/*!sc*/ .fdROMU{width:100%;border-collapse:separate;border-spacing:0;border:1px solid;border-color:var(--borderColor-default,var(--color-border-default,#d0d7de));border-radius:6px;table-layout:fixed;overflow:unset;}/*!sc*/ .jGKpsv{height:0px;line-height:0px;}/*!sc*/ .jGKpsv tr{height:0px;font-size:0px;}/*!sc*/ .jdgHnn{padding:16px;color:var(--fgColor-muted,var(--color-fg-muted,#656d76));font-size:12px;text-align:left;height:40px;}/*!sc*/ .jdgHnn th{padding-left:16px;background-color:var(--bgColor-muted,var(--color-canvas-subtle,#f6f8fa));}/*!sc*/ .bQivRW{width:100%;border-top-left-radius:6px;}/*!sc*/ @media screen and (min-width:544px){.bQivRW{display:none;}}/*!sc*/ .ldkMIO{width:40%;border-top-left-radius:6px;}/*!sc*/ @media screen and (max-width:543px){.ldkMIO{display:none;}}/*!sc*/ .jMbWeI{text-align:right;padding-right:16px;width:136px;border-top-right-radius:6px;}/*!sc*/ .gpqjiB{color:var(--fgColor-muted,var(--color-fg-muted,#656d76));font-size:12px;height:40px;}/*!sc*/ .dzCJzi{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;min-width:273px;padding:8px;}/*!sc*/ @media screen and (min-width:544px){.dzCJzi{-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;}}/*!sc*/ .eNCcrz{text-align:center;vertical-align:center;height:40px;border-top:1px solid;border-color:var(--borderColor-default,var(--color-border-default,#d0d7de));}/*!sc*/ .bHTcCe{border-top:1px solid var(--borderColor-default,var(--color-border-default));cursor:pointer;}/*!sc*/ .csrIcr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;gap:16px;}/*!sc*/ .bUQNHB{border:1px solid;border-color:var(--borderColor-default,var(--color-border-default,#d0d7de));border-radius:6px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}/*!sc*/ @media screen and (max-width:543px){.bUQNHB{margin-left:-16px;margin-right:-16px;max-width:calc(100% + 32px);}}/*!sc*/ @media screen and (min-width:544px){.bUQNHB{max-width:100%;}}/*!sc*/ .jPdcfu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;border-bottom:1px solid;border-bottom-color:var(--borderColor-default,var(--color-border-default,#d0d7de));-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-right:8px;position:-webkit-sticky;position:sticky;top:0;background-color:var(--bgColor-default,var(--color-canvas-default,#ffffff));z-index:1;border-top-left-radius:6px;border-top-right-radius:6px;}/*!sc*/ .iphEWz{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;border-bottom:none;max-width:100%;padding-left:8px;padding-right:8px;}/*!sc*/ .hUCRAk{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}/*!sc*/ .cwoBXV[data-size="medium"]{color:var(--fgColor-muted,var(--color-fg-subtle,#6e7781));padding-left:8px;padding-right:8px;}/*!sc*/ .QkQOb{padding:32px;overflow:auto;}/*!sc*/ data-styled.g1[id="Box-sc-g0xbh4-0"]{content:"iVEunk,jzuOtQ,bGojzy,iNSVHo,bVgnfw,CEgMp,gMOVLe,gUkoLg,bZBlpz,lhTYNA,ffLUq,bmcJak,fLXEGX,lmSMZJ,dqfxud,fGwBZA,jxTzTd,gqqBXN,dzXgxt,iWFGlI,vcvyP,YUPas,izFOf,vIPPs,fdROMU,jGKpsv,jdgHnn,bQivRW,ldkMIO,jMbWeI,gpqjiB,dzCJzi,eNCcrz,bHTcCe,csrIcr,bUQNHB,jPdcfu,iphEWz,hUCRAk,cwoBXV,QkQOb,"}/*!sc*/ .brGdpi{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;-webkit-clip:rect(0,0,0,0);clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}/*!sc*/ data-styled.g6[id="_VisuallyHidden__VisuallyHidden-sc-11jhm7a-0"]{content:"brGdpi,"}/*!sc*/ .hWlpPn{position:relative;display:inline-block;}/*!sc*/ .hWlpPn::after{position:absolute;z-index:1000000;display:none;padding:0.5em 0.75em;font:normal normal 11px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";-webkit-font-smoothing:subpixel-antialiased;color:var(--tooltip-fgColor,var(--fgColor-onEmphasis,var(--color-fg-on-emphasis,#ffffff)));text-align:center;-webkit-text-decoration:none;text-decoration:none;text-shadow:none;text-transform:none;-webkit-letter-spacing:normal;-moz-letter-spacing:normal;-ms-letter-spacing:normal;letter-spacing:normal;word-wrap:break-word;white-space:pre;pointer-events:none;content:attr(aria-label);background:var(--tooltip-bgColor,var(--bgColor-emphasis,var(--color-neutral-emphasis-plus,#24292f)));border-radius:6px;opacity:0;}/*!sc*/ @-webkit-keyframes tooltip-appear{from{opacity:0;}to{opacity:1;}}/*!sc*/ @keyframes tooltip-appear{from{opacity:0;}to{opacity:1;}}/*!sc*/ .hWlpPn:hover::after,.hWlpPn:active::after,.hWlpPn:focus::after,.hWlpPn:focus-within::after{display:inline-block;-webkit-text-decoration:none;text-decoration:none;-webkit-animation-name:tooltip-appear;animation-name:tooltip-appear;-webkit-animation-duration:0.1s;animation-duration:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-animation-delay:0s;animation-delay:0s;}/*!sc*/ .hWlpPn.tooltipped-no-delay:hover::after,.hWlpPn.tooltipped-no-delay:active::after,.hWlpPn.tooltipped-no-delay:focus::after,.hWlpPn.tooltipped-no-delay:focus-within::after{-webkit-animation-delay:0s;animation-delay:0s;}/*!sc*/ .hWlpPn.tooltipped-multiline:hover::after,.hWlpPn.tooltipped-multiline:active::after,.hWlpPn.tooltipped-multiline:focus::after,.hWlpPn.tooltipped-multiline:focus-within::after{display:table-cell;}/*!sc*/ .hWlpPn.tooltipped-s::after,.hWlpPn.tooltipped-se::after,.hWlpPn.tooltipped-sw::after{top:100%;right:50%;margin-top:6px;}/*!sc*/ .hWlpPn.tooltipped-se::after{right:auto;left:50%;margin-left:-16px;}/*!sc*/ .hWlpPn.tooltipped-sw::after{margin-right:-16px;}/*!sc*/ .hWlpPn.tooltipped-n::after,.hWlpPn.tooltipped-ne::after,.hWlpPn.tooltipped-nw::after{right:50%;bottom:100%;margin-bottom:6px;}/*!sc*/ .hWlpPn.tooltipped-ne::after{right:auto;left:50%;margin-left:-16px;}/*!sc*/ .hWlpPn.tooltipped-nw::after{margin-right:-16px;}/*!sc*/ .hWlpPn.tooltipped-s::after,.hWlpPn.tooltipped-n::after{-webkit-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%);}/*!sc*/ .hWlpPn.tooltipped-w::after{right:100%;bottom:50%;margin-right:6px;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%);}/*!sc*/ .hWlpPn.tooltipped-e::after{bottom:50%;left:100%;margin-left:6px;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%);}/*!sc*/ .hWlpPn.tooltipped-multiline::after{width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:250px;word-wrap:break-word;white-space:pre-line;border-collapse:separate;}/*!sc*/ .hWlpPn.tooltipped-multiline.tooltipped-s::after,.hWlpPn.tooltipped-multiline.tooltipped-n::after{right:auto;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);}/*!sc*/ .hWlpPn.tooltipped-multiline.tooltipped-w::after,.hWlpPn.tooltipped-multiline.tooltipped-e::after{right:100%;}/*!sc*/ .hWlpPn.tooltipped-align-right-2::after{right:0;margin-right:0;}/*!sc*/ .hWlpPn.tooltipped-align-left-2::after{left:0;margin-left:0;}/*!sc*/ data-styled.g17[id="Tooltip__TooltipBase-sc-17tf59c-0"]{content:"hWlpPn,"}/*!sc*/ .liVpTx{display:inline-block;overflow:hidden;text-overflow:ellipsis;vertical-align:top;white-space:nowrap;max-width:125px;}/*!sc*/ data-styled.g19[id="Truncate__StyledTruncate-sc-23o1d2-0"]{content:"liVpTx,"}/*!sc*/ </style> <!-- --> <!-- --> <div class="Box-sc-g0xbh4-0 iVEunk"><div class="Box-sc-g0xbh4-0 jzuOtQ"><div class="Box-sc-g0xbh4-0 bGojzy"></div></div><div class="Box-sc-g0xbh4-0 iNSVHo"><div class="Box-sc-g0xbh4-0 bVgnfw"><div class="Box-sc-g0xbh4-0 CEgMp"><button type="button" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-label="main branch" data-testid="anchor-button" class="Box-sc-g0xbh4-0 gMOVLe prc-Button-ButtonBase-c50BI overview-ref-selector width-full" data-loading="false" data-size="medium" data-variant="default" aria-describedby="branch-picker-repos-header-ref-selector-loading-announcement" id="branch-picker-repos-header-ref-selector"><span data-component="buttonContent" class="Box-sc-g0xbh4-0 gUkoLg prc-Button-ButtonContent-HKbr-"><span data-component="text" class="prc-Button-Label-pTQ3x"><div class="Box-sc-g0xbh4-0 bZBlpz"><div class="Box-sc-g0xbh4-0 lhTYNA"><svg aria-hidden="true" focusable="false" class="octicon octicon-git-branch" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z"></path></svg></div><div class="Box-sc-g0xbh4-0 ffLUq ref-selector-button-text-container"><span class="Box-sc-g0xbh4-0 bmcJak prc-Text-Text-0ima0"> <!-- -->main</span></div></div></span><span data-component="trailingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-triangle-down" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path></svg></span></span></button><button hidden="" data-hotkey-scope="read-only-cursor-text-area"></button></div><div class="Box-sc-g0xbh4-0 fLXEGX"><a style="--button-color:fg.muted" type="button" href="/niklak/dom_query/branches" class="Box-sc-g0xbh4-0 lmSMZJ prc-Button-ButtonBase-c50BI" data-loading="false" data-size="medium" data-variant="invisible" aria-describedby=":Rclab:-loading-announcement"><span data-component="buttonContent" class="Box-sc-g0xbh4-0 gUkoLg prc-Button-ButtonContent-HKbr-"><span data-component="leadingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-git-branch" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z"></path></svg></span><span data-component="text" class="prc-Button-Label-pTQ3x">Branches</span></span></a><a style="--button-color:fg.muted" type="button" href="/niklak/dom_query/tags" class="Box-sc-g0xbh4-0 lmSMZJ prc-Button-ButtonBase-c50BI" data-loading="false" data-size="medium" data-variant="invisible" aria-describedby=":Rklab:-loading-announcement"><span data-component="buttonContent" class="Box-sc-g0xbh4-0 gUkoLg prc-Button-ButtonContent-HKbr-"><span data-component="leadingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-tag" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path></svg></span><span data-component="text" class="prc-Button-Label-pTQ3x">Tags</span></span></a></div><div class="Box-sc-g0xbh4-0 dqfxud"><a style="--button-color:fg.muted" type="button" aria-label="Go to Branches page" href="/niklak/dom_query/branches" class="Box-sc-g0xbh4-0 fGwBZA prc-Button-ButtonBase-c50BI" data-loading="false" data-no-visuals="true" data-size="medium" data-variant="invisible" aria-describedby=":Relab:-loading-announcement"><svg aria-hidden="true" focusable="false" class="octicon octicon-git-branch" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z"></path></svg></a><a style="--button-color:fg.muted" type="button" aria-label="Go to Tags page" href="/niklak/dom_query/tags" class="Box-sc-g0xbh4-0 fGwBZA prc-Button-ButtonBase-c50BI" data-loading="false" data-no-visuals="true" data-size="medium" data-variant="invisible" aria-describedby=":Rmlab:-loading-announcement"><svg aria-hidden="true" focusable="false" class="octicon octicon-tag" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path></svg></a></div></div><div class="Box-sc-g0xbh4-0 jxTzTd"><div class="Box-sc-g0xbh4-0 gqqBXN"><div class="Box-sc-g0xbh4-0 dzXgxt"><!--$--><div class="Box-sc-g0xbh4-0 iWFGlI"><span class="Box-sc-g0xbh4-0 vcvyP TextInput-wrapper prc-components-TextInputWrapper-i1ofR prc-components-TextInputBaseWrapper-ueK9q" data-leading-visual="true" data-trailing-visual="true" aria-busy="false"><span class="TextInput-icon" id=":R2j5ab:" aria-hidden="true"><svg aria-hidden="true" focusable="false" class="octicon octicon-search" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path></svg></span><input type="text" aria-label="Go to file" role="combobox" aria-controls="file-results-list" aria-expanded="false" aria-haspopup="dialog" autoCorrect="off" spellcheck="false" placeholder="Go to file" aria-describedby=":R2j5ab: :R2j5abH1:" data-component="input" class="prc-components-Input-Ic-y8" value=""/><span class="TextInput-icon" id=":R2j5abH1:" aria-hidden="true"></span></span></div><!--/$--></div><div class="Box-sc-g0xbh4-0 YUPas"><button type="button" class="prc-Button-ButtonBase-c50BI" data-loading="false" data-no-visuals="true" data-size="medium" data-variant="default" aria-describedby=":Rr5ab:-loading-announcement"><span data-component="buttonContent" data-align="center" class="prc-Button-ButtonContent-HKbr-"><span data-component="text" class="prc-Button-Label-pTQ3x">Go to file</span></span></button></div><div class="react-directory-add-file-icon"></div><div class="react-directory-remove-file-icon"></div></div><button type="button" aria-haspopup="true" aria-expanded="false" tabindex="0" class="prc-Button-ButtonBase-c50BI" data-loading="false" data-size="medium" data-variant="primary" aria-describedby=":R55ab:-loading-announcement" id=":R55ab:"><span data-component="buttonContent" data-align="center" class="prc-Button-ButtonContent-HKbr-"><span data-component="leadingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-code hide-sm" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z"></path></svg></span><span data-component="text" class="prc-Button-Label-pTQ3x">Code</span><span data-component="trailingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-triangle-down" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z"></path></svg></span></span></button><div class="Box-sc-g0xbh4-0 izFOf"><button data-component="IconButton" type="button" aria-label="Open more actions menu" aria-haspopup="true" aria-expanded="false" tabindex="0" class="prc-Button-ButtonBase-c50BI prc-Button-IconButton-szpyj" data-loading="false" data-no-visuals="true" data-size="medium" data-variant="default" aria-describedby=":R75ab:-loading-announcement" id=":R75ab:"><svg aria-hidden="true" focusable="false" class="octicon octicon-kebab-horizontal" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M8 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3ZM1.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm13 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path></svg></button></div></div></div><div class="Box-sc-g0xbh4-0 vIPPs"><div data-hpc="true"><button hidden="" data-testid="focus-next-element-button" data-hotkey="j"></button><button hidden="" data-testid="focus-previous-element-button" data-hotkey="k"></button><h2 class="sr-only ScreenReaderHeading-module__userSelectNone--vW4Cq prc-Heading-Heading-6CmGO" data-testid="screen-reader-heading" id="folders-and-files">Folders and files</h2><table aria-labelledby="folders-and-files" class="Box-sc-g0xbh4-0 fdROMU"><thead class="Box-sc-g0xbh4-0 jGKpsv"><tr class="Box-sc-g0xbh4-0 jdgHnn"><th colSpan="2" class="Box-sc-g0xbh4-0 bQivRW"><span class="text-bold">Name</span></th><th colSpan="1" class="Box-sc-g0xbh4-0 ldkMIO"><span class="text-bold">Name</span></th><th class="hide-sm"><div title="Last commit message" class="Truncate__StyledTruncate-sc-23o1d2-0 liVpTx width-fit"><span class="text-bold">Last commit message</span></div></th><th colSpan="1" class="Box-sc-g0xbh4-0 jMbWeI"><div title="Last commit date" class="Truncate__StyledTruncate-sc-23o1d2-0 liVpTx width-fit"><span class="text-bold">Last commit date</span></div></th></tr></thead><tbody><tr class="Box-sc-g0xbh4-0 gpqjiB"><td colSpan="3" class="bgColor-muted p-1 rounded-top-2"><div class="Box-sc-g0xbh4-0 dzCJzi"><h2 class="sr-only ScreenReaderHeading-module__userSelectNone--vW4Cq prc-Heading-Heading-6CmGO" data-testid="screen-reader-heading">Latest commit</h2><div style="width:120px" class="Skeleton Skeleton--text" data-testid="loading"> </div><div class="d-flex flex-shrink-0 gap-2"><div data-testid="latest-commit-details" class="d-none d-sm-flex flex-items-center"></div><div class="d-flex gap-2"><h2 class="sr-only ScreenReaderHeading-module__userSelectNone--vW4Cq prc-Heading-Heading-6CmGO" data-testid="screen-reader-heading">History</h2><a href="/niklak/dom_query/commits/main/" class="prc-Button-ButtonBase-c50BI d-none d-lg-flex LinkButton-module__code-view-link-button--xvCGA flex-items-center fgColor-default" data-loading="false" data-size="small" data-variant="invisible" aria-describedby=":Raqj8pab:-loading-announcement"><span data-component="buttonContent" data-align="center" class="prc-Button-ButtonContent-HKbr-"><span data-component="leadingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-history" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="m.427 1.927 1.215 1.215a8.002 8.002 0 1 1-1.6 5.685.75.75 0 1 1 1.493-.154 6.5 6.5 0 1 0 1.18-4.458l1.358 1.358A.25.25 0 0 1 3.896 6H.25A.25.25 0 0 1 0 5.75V2.104a.25.25 0 0 1 .427-.177ZM7.75 4a.75.75 0 0 1 .75.75v2.992l2.028.812a.75.75 0 0 1-.557 1.392l-2.5-1A.751.751 0 0 1 7 8.25v-3.5A.75.75 0 0 1 7.75 4Z"></path></svg></span><span data-component="text" class="prc-Button-Label-pTQ3x"><span class="fgColor-default">568 Commits</span></span></span></a><div class="d-sm-none"></div><div class="d-flex d-lg-none"><span role="tooltip" aria-label="568 Commits" id="history-icon-button-tooltip" class="Tooltip__TooltipBase-sc-17tf59c-0 hWlpPn tooltipped-n"><a href="/niklak/dom_query/commits/main/" class="prc-Button-ButtonBase-c50BI LinkButton-module__code-view-link-button--xvCGA flex-items-center fgColor-default" data-loading="false" data-size="small" data-variant="invisible" aria-describedby=":R1iqj8pab:-loading-announcement history-icon-button-tooltip"><span data-component="buttonContent" data-align="center" class="prc-Button-ButtonContent-HKbr-"><span data-component="leadingVisual" class="prc-Button-Visual-2epfX prc-Button-VisualWrap-Db-eB"><svg aria-hidden="true" focusable="false" class="octicon octicon-history" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="m.427 1.927 1.215 1.215a8.002 8.002 0 1 1-1.6 5.685.75.75 0 1 1 1.493-.154 6.5 6.5 0 1 0 1.18-4.458l1.358 1.358A.25.25 0 0 1 3.896 6H.25A.25.25 0 0 1 0 5.75V2.104a.25.25 0 0 1 .427-.177ZM7.75 4a.75.75 0 0 1 .75.75v2.992l2.028.812a.75.75 0 0 1-.557 1.392l-2.5-1A.751.751 0 0 1 7 8.25v-3.5A.75.75 0 0 1 7.75 4Z"></path></svg></span></span></a></span></div></div></div></div></td></tr><tr class="react-directory-row undefined" id="folder-row-0"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".cargo" aria-label=".cargo, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/.cargo">.cargo</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".cargo" aria-label=".cargo, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/.cargo">.cargo</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-1"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".github" aria-label=".github, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/.github">.github</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".github" aria-label=".github, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/.github">.github</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-2"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="examples" aria-label="examples, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/examples">examples</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="examples" aria-label="examples, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/examples">examples</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-3"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="src" aria-label="src, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/src">src</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="src" aria-label="src, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/src">src</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-4"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="test-pages" aria-label="test-pages, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/test-pages">test-pages</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="test-pages" aria-label="test-pages, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/test-pages">test-pages</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-5"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="tests" aria-label="tests, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/tests">tests</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file-directory-fill icon-directory" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="tests" aria-label="tests, (Directory)" class="Link--primary" href="/niklak/dom_query/tree/main/tests">tests</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-6"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".gitattributes" aria-label=".gitattributes, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/.gitattributes">.gitattributes</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".gitattributes" aria-label=".gitattributes, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/.gitattributes">.gitattributes</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-7"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".gitignore" aria-label=".gitignore, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/.gitignore">.gitignore</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title=".gitignore" aria-label=".gitignore, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/.gitignore">.gitignore</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-8"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="CHANGELOG.md" aria-label="CHANGELOG.md, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/CHANGELOG.md">CHANGELOG.md</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="CHANGELOG.md" aria-label="CHANGELOG.md, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/CHANGELOG.md">CHANGELOG.md</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row undefined" id="folder-row-9"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="Cargo.toml" aria-label="Cargo.toml, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/Cargo.toml">Cargo.toml</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="Cargo.toml" aria-label="Cargo.toml, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/Cargo.toml">Cargo.toml</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row truncate-for-mobile" id="folder-row-10"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="Examples.md" aria-label="Examples.md, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/Examples.md">Examples.md</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="Examples.md" aria-label="Examples.md, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/Examples.md">Examples.md</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row truncate-for-mobile" id="folder-row-11"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="LICENSE" aria-label="LICENSE, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/LICENSE">LICENSE</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="LICENSE" aria-label="LICENSE, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/LICENSE">LICENSE</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="react-directory-row truncate-for-mobile" id="folder-row-12"><td class="react-directory-row-name-cell-small-screen" colSpan="2"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="README.md" aria-label="README.md, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/README.md">README.md</a></div></div></div></div></td><td class="react-directory-row-name-cell-large-screen" colSpan="1"><div class="react-directory-filename-column"><svg aria-hidden="true" focusable="false" class="octicon octicon-file color-fg-muted" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z"></path></svg><div class="overflow-hidden"><div class="react-directory-filename-cell"><div class="react-directory-truncate"><a title="README.md" aria-label="README.md, (File)" class="Link--primary" href="/niklak/dom_query/blob/main/README.md">README.md</a></div></div></div></div></td><td class="react-directory-row-commit-cell"><div class="Skeleton Skeleton--text"> </div></td><td><div class="Skeleton Skeleton--text"> </div></td></tr><tr class="Box-sc-g0xbh4-0 eNCcrz show-for-mobile" data-testid="view-all-files-row"><td colSpan="3" class="Box-sc-g0xbh4-0 bHTcCe"><div><button class="prc-Link-Link-85e08">View all files</button></div></td></tr></tbody></table></div><div class="Box-sc-g0xbh4-0 csrIcr"><div class="Box-sc-g0xbh4-0 bUQNHB"><div itemscope="" itemType="https://schema.org/abstract" class="Box-sc-g0xbh4-0 jPdcfu"><h2 class="_VisuallyHidden__VisuallyHidden-sc-11jhm7a-0 brGdpi">Repository files navigation</h2><nav class="Box-sc-g0xbh4-0 iphEWz prc-components-UnderlineWrapper-oOh5J" aria-label="Repository files"><ul class="prc-components-UnderlineItemList-b23Hf" role="list"><li class="Box-sc-g0xbh4-0 hUCRAk"><a class="prc-components-UnderlineItem-lJsg-" href="#" aria-current="page"><span data-component="icon"><svg aria-hidden="true" focusable="false" class="octicon octicon-book" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path></svg></span><span data-component="text" data-content="README">README</span></a></li><li class="Box-sc-g0xbh4-0 hUCRAk"><a class="prc-components-UnderlineItem-lJsg-" href="#"><span data-component="icon"><svg aria-hidden="true" focusable="false" class="octicon octicon-law" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M8.75.75V2h.985c.304 0 .603.08.867.231l1.29.736c.038.022.08.033.124.033h2.234a.75.75 0 0 1 0 1.5h-.427l2.111 4.692a.75.75 0 0 1-.154.838l-.53-.53.529.531-.001.002-.002.002-.006.006-.006.005-.01.01-.045.04c-.21.176-.441.327-.686.45C14.556 10.78 13.88 11 13 11a4.498 4.498 0 0 1-2.023-.454 3.544 3.544 0 0 1-.686-.45l-.045-.04-.016-.015-.006-.006-.004-.004v-.001a.75.75 0 0 1-.154-.838L12.178 4.5h-.162c-.305 0-.604-.079-.868-.231l-1.29-.736a.245.245 0 0 0-.124-.033H8.75V13h2.5a.75.75 0 0 1 0 1.5h-6.5a.75.75 0 0 1 0-1.5h2.5V3.5h-.984a.245.245 0 0 0-.124.033l-1.289.737c-.265.15-.564.23-.869.23h-.162l2.112 4.692a.75.75 0 0 1-.154.838l-.53-.53.529.531-.001.002-.002.002-.006.006-.016.015-.045.04c-.21.176-.441.327-.686.45C4.556 10.78 3.88 11 3 11a4.498 4.498 0 0 1-2.023-.454 3.544 3.544 0 0 1-.686-.45l-.045-.04-.016-.015-.006-.006-.004-.004v-.001a.75.75 0 0 1-.154-.838L2.178 4.5H1.75a.75.75 0 0 1 0-1.5h2.234a.249.249 0 0 0 .125-.033l1.288-.737c.265-.15.564-.23.869-.23h.984V.75a.75.75 0 0 1 1.5 0Zm2.945 8.477c.285.135.718.273 1.305.273s1.02-.138 1.305-.273L13 6.327Zm-10 0c.285.135.718.273 1.305.273s1.02-.138 1.305-.273L3 6.327Z"></path></svg></span><span data-component="text" data-content="MIT license">MIT license</span></a></li></ul></nav><button style="--button-color:fg.subtle" type="button" aria-label="Outline" aria-haspopup="true" aria-expanded="false" tabindex="0" class="Box-sc-g0xbh4-0 cwoBXV prc-Button-ButtonBase-c50BI" data-loading="false" data-size="medium" data-variant="invisible" aria-describedby=":Rr9ab:-loading-announcement" id=":Rr9ab:"><svg aria-hidden="true" focusable="false" class="octicon octicon-list-unordered" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" display="inline-block" overflow="visible" style="vertical-align:text-bottom"><path d="M5.75 2.5h8.5a.75.75 0 0 1 0 1.5h-8.5a.75.75 0 0 1 0-1.5Zm0 5h8.5a.75.75 0 0 1 0 1.5h-8.5a.75.75 0 0 1 0-1.5Zm0 5h8.5a.75.75 0 0 1 0 1.5h-8.5a.75.75 0 0 1 0-1.5ZM2 14a1 1 0 1 1 0-2 1 1 0 0 1 0 2Zm1-6a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM2 4a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg></button></div><div class="Box-sc-g0xbh4-0 QkQOb js-snippet-clipboard-copy-unpositioned undefined" data-hpc="true"><article class="markdown-body entry-content container-lg" itemprop="text"><div class="markdown-heading" dir="auto"><h1 tabindex="-1" class="heading-element" dir="auto">DOM_QUERY: A Flexible Rust Crate for DOM Querying and Manipulation</h1><a id="user-content-dom_query-a-flexible-rust-crate-for-dom-querying-and-manipulation" class="anchor" aria-label="Permalink: DOM_QUERY: A Flexible Rust Crate for DOM Querying and Manipulation" href="#dom_query-a-flexible-rust-crate-for-dom-querying-and-manipulation"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <p dir="auto"><a href="https://crates.io/crates/dom_query" rel="nofollow"><img src="https://camo.githubusercontent.com/a35f3f5f7a1ef7f9f27d052df34edd7cad8d9e19427131b241b09b7ff95d2110/68747470733a2f2f696d672e736869656c64732e696f2f6372617465732f762f646f6d5f71756572792e7376673f7374796c653d666c6174" alt="Crates.io version" data-canonical-src="https://img.shields.io/crates/v/dom_query.svg?style=flat" style="max-width: 100%;"></a> <a href="https://crates.io/crates/dom_query" rel="nofollow"><img src="https://camo.githubusercontent.com/97baccacf6b27855a154855e0a6f0f4d2c13142d19bbcdeed4744f271742702f/68747470733a2f2f696d672e736869656c64732e696f2f6372617465732f642f646f6d5f71756572792e7376673f7374796c653d666c6174" alt="Download" data-canonical-src="https://img.shields.io/crates/d/dom_query.svg?style=flat" style="max-width: 100%;"></a> <a href="https://docs.rs/dom_query" rel="nofollow"><img src="https://camo.githubusercontent.com/bb4bae7218ec61145d467f1d4c03759410b18a010a156d8813339f75e33a0c58/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f646f63732d6c61746573742d626c75652e7376673f7374796c653d666c6174" alt="docs.rs docs" data-canonical-src="https://img.shields.io/badge/docs-latest-blue.svg?style=flat" style="max-width: 100%;"></a> <a href="https://codecov.io/gh/niklak/dom_query" rel="nofollow"><img src="https://camo.githubusercontent.com/34b428c6864b5f326e5d9cfb730a7e591c3742c5fe9e4e6bcf03ba71ce5547c1/68747470733a2f2f636f6465636f762e696f2f67682f6e696b6c616b2f646f6d5f71756572792f67726170682f62616467652e7376673f746f6b656e3d434641564f494536314f" alt="codecov" data-canonical-src="https://codecov.io/gh/niklak/dom_query/graph/badge.svg?token=CFAVOIE61O" style="max-width: 100%;"></a></p> <p dir="auto"><a href="https://github.com/niklak/dom_query/actions/workflows/rust.yml"><img src="https://github.com/niklak/dom_query/actions/workflows/rust.yml/badge.svg?branch=main" alt="Build Status" style="max-width: 100%;"></a> <a href="https://github.com/niklak/dom_query/actions/workflows/raspberrypi5.yml"><img src="https://github.com/niklak/dom_query/actions/workflows/raspberrypi5.yml/badge.svg" alt="Raspberry Pi 5 CI" style="max-width: 100%;"></a> <a href="https://github.com/niklak/dom_query/actions/workflows/wasm.yml"><img src="https://github.com/niklak/dom_query/actions/workflows/wasm.yml/badge.svg" alt="wasm ci" style="max-width: 100%;"></a></p> <p dir="auto">DOM_QUERY is a flexible Rust crate that simplifies HTML parsing, DOM querying and manipulation by providing a high-level jQuery-like API. It uses the <code>html5ever</code> crate for HTML parsing and the <code>selectors</code> crate for efficient DOM traversal and element selection.</p> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Features</h2><a id="user-content-features" class="anchor" aria-label="Permalink: Features" href="#features"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <ul dir="auto"> <li>Parse HTML documents and fragments</li> <li>Query DOM elements using CSS selectors</li> <li>Traverse the DOM tree (ancestors, parents, children, siblings)</li> <li>Manipulate elements and their attributes: <ul dir="auto"> <li>Add/remove/modify attributes</li> <li>Change element content</li> <li>Add/remove elements</li> <li>Rename elements</li> <li>Move elements within the DOM tree</li> </ul> </li> </ul> <div class="markdown-alert markdown-alert-note" dir="auto"><p class="markdown-alert-title" dir="auto"><svg class="octicon octicon-info mr-2" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg>Note</p><p dir="auto">This crate is a significantly enhanced fork of <a href="https://crates.io/crates/nipper" rel="nofollow">nipper</a>, featuring expanded CSS selector support, enhanced DOM traversal and improved DOM manipulation capabilities.</p> </div> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Examples</h2><a id="user-content-examples" class="anchor" aria-label="Permalink: Examples" href="#examples"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <details> <summary><b>Parsing a document</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; use tendril::StrTendril; // Document may consume &str, String, StrTendril let contents_str = r#"<!DOCTYPE html> <html><head><title>Test Page</title></head><body></body></html>"#; let doc = Document::from(contents_str); let contents_string = contents_str.to_string(); let doc = Document::from(contents_string); let contents_tendril = StrTendril::from(contents_str); let doc = Document::from(contents_tendril); // The root element for the `Document` is a Document assert!(doc.root().is_document()); // if the source has DocType, then the Document will also have one // as a first child. assert!(doc.root().first_child().unwrap().is_doctype()); //both of them are not elements."><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">use</span> tendril<span class="pl-kos">::</span><span class="pl-v">StrTendril</span><span class="pl-kos">;</span> <span class="pl-c">// Document may consume &str, String, StrTendril</span> <span class="pl-k">let</span> contents_str = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html><head><title>Test Page</title></head><body></body></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents_str<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents_string = contents_str<span class="pl-kos">.</span><span class="pl-en">to_string</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents_string<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents_tendril = <span class="pl-smi">StrTendril</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents_str<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents_tendril<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// The root element for the `Document` is a Document</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>root<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>is_document<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// if the source has DocType, then the Document will also have one</span> <span class="pl-c">// as a first child.</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>root<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>first_child<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>unwrap<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>is_doctype<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//both of them are not elements.</span></pre></div> </details> <details> <summary><b>Parsing a fragment</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; use tendril::StrTendril; // fragment can be created with Document::fragment(), which accepts &str, String, StrTendril let contents_str = r#"<!DOCTYPE html> <html><head><title>Test Page</title></head><body></body></html>"#; let fragment = Document::fragment(contents_str); let contents_string = contents_str.to_string(); let fragment = Document::fragment(contents_string); let contents_tendril = StrTendril::from(contents_str); let fragment = Document::fragment(contents_tendril); // The root element for the fragment is not a Document but a Fragment assert!(!fragment.root().is_document()); assert!(fragment.root().is_fragment()); // and when it parses a fragment, it drops Doctype assert!(!fragment.root().first_child().unwrap().is_doctype());"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">use</span> tendril<span class="pl-kos">::</span><span class="pl-v">StrTendril</span><span class="pl-kos">;</span> <span class="pl-c">// fragment can be created with Document::fragment(), which accepts &str, String, StrTendril</span> <span class="pl-k">let</span> contents_str = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html><head><title>Test Page</title></head><body></body></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> fragment = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">fragment</span><span class="pl-kos">(</span>contents_str<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents_string = contents_str<span class="pl-kos">.</span><span class="pl-en">to_string</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> fragment = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">fragment</span><span class="pl-kos">(</span>contents_string<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents_tendril = <span class="pl-smi">StrTendril</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents_str<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> fragment = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">fragment</span><span class="pl-kos">(</span>contents_tendril<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// The root element for the fragment is not a Document but a Fragment</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!fragment<span class="pl-kos">.</span>root<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>is_document<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>fragment<span class="pl-kos">.</span>root<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>is_fragment<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// and when it parses a fragment, it drops Doctype</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!fragment<span class="pl-kos">.</span>root<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>first_child<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>unwrap<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>is_doctype<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Selecting elements</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html = r#"<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Test Page</title> </head> <body> <h1>Test Page</h1> <ul> <li>One</li> <li><a href="/2">Two</a></li> <li><a href="/3">Three</a></li> </ul> </body> </html>"#; let document = Document::from(html); // select a single element let a = document.select("ul li:nth-child(2)"); let text = a.text().to_string(); assert!(text == "Two"); // selecting multiple elements document.select("ul > li:has(a)").iter().for_each(|el| { assert!(el.is("li")); }) // there is also `try_select` which returns an Option let no_sel = document.try_select("p"); assert!(no_sel.is_none()); "><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head></span> <span class="pl-s"> <meta charset="utf-8"></span> <span class="pl-s"> <title>Test Page</title></span> <span class="pl-s"> </head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <h1>Test Page</h1></span> <span class="pl-s"> <ul></span> <span class="pl-s"> <li>One</li></span> <span class="pl-s"> <li><a href="/2">Two</a></li></span> <span class="pl-s"> <li><a href="/3">Three</a></li></span> <span class="pl-s"> </ul></span> <span class="pl-s"> </body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> document = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// select a single element</span> <span class="pl-k">let</span> a = document<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"ul li:nth-child(2)"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> text = a<span class="pl-kos">.</span><span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">to_string</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>text == <span class="pl-s">"Two"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// selecting multiple elements</span> document<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"ul > li:has(a)"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">for_each</span><span class="pl-kos">(</span>|el| <span class="pl-kos">{</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>el<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"li"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-c">// there is also `try_select` which returns an Option</span><span class="pl-kos"></span> <span class="pl-k">let</span> no_sel = document<span class="pl-kos">.</span><span class="pl-en">try_select</span><span class="pl-kos">(</span><span class="pl-s">"p"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>no_sel<span class="pl-kos">.</span>is_none<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Selecting a single match and multiple matches</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let doc: Document = r#"<!DOCTYPE html> <html lang="en"> <head></head> <body> <ul class="list"> <li>1</li><li>2</li><li>3</li> </ul> <ul class="list"> <li>4</li><li>5</li><li>6</li> </ul> </body> </html>"# .into(); // if you need to select only the first, single match, you can use following: let single_selection = doc.select_single(".list"); // access is only for the first matching: assert_eq!(single_selection.length(), 1); assert_eq!(single_selection.inner_html().to_string().trim(), "<li>1</li><li>2</li><li>3</li>"); // simple selection contains all matches: let selection = doc.select(".list"); assert_eq!(selection.length(), 2); // but if you call inner_html() on it, you will get the inner_html of the first match: assert_eq!(selection.inner_html().to_string().trim(), "<li>1</li><li>2</li><li>3</li>"); //this approach is using the first node from nodes vec and `select_single` consumes one iteration instead. let first_selection = doc.select(".list").first(); assert_eq!(first_selection.length(), 1); assert_eq!(first_selection.inner_html().to_string().trim(), "<li>1</li><li>2</li><li>3</li>"); // this approach is consuming all nodes into vec at first, and then you can call `iter().next()` to get the first one. let next_selection = doc.select(".list").iter().next().unwrap(); assert_eq!(next_selection.length(), 1); assert_eq!(next_selection.inner_html().to_string().trim(), "<li>1</li><li>2</li><li>3</li>"); // currently, to get data from all matches you need to iterate over them, either: let all_matched: String = selection.iter().map(|s| s.inner_html().trim().to_string()).collect(); assert_eq!( all_matched, "<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li>" ); // or: let all_matched: String = selection.nodes().iter().map(|s| s.inner_html().trim().to_string()).collect(); / which is more efficient. assert_eq!( all_matched, "<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li>" );"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc<span class="pl-kos">:</span> <span class="pl-smi">Document</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html lang="en"></span> <span class="pl-s"><head></head></span> <span class="pl-s"><body></span> <span class="pl-s"> <ul class="list"></span> <span class="pl-s"> <li>1</li><li>2</li><li>3</li></span> <span class="pl-s"> </ul></span> <span class="pl-s"> <ul class="list"></span> <span class="pl-s"> <li>4</li><li>5</li><li>6</li></span> <span class="pl-s"> </ul></span> <span class="pl-s"></body></span> <span class="pl-s"></html>"#</span> <span class="pl-kos">.</span><span class="pl-en">into</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// if you need to select only the first, single match, you can use following:</span> <span class="pl-k">let</span> single_selection = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">".list"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// access is only for the first matching:</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>single_selection<span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">1</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>single_selection<span class="pl-kos">.</span>inner_html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>trim<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"<li>1</li><li>2</li><li>3</li>"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// simple selection contains all matches:</span> <span class="pl-k">let</span> selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".list"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>selection<span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">2</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// but if you call inner_html() on it, you will get the inner_html of the first match:</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>selection<span class="pl-kos">.</span>inner_html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>trim<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"<li>1</li><li>2</li><li>3</li>"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//this approach is using the first node from nodes vec and `select_single` consumes one iteration instead.</span> <span class="pl-k">let</span> first_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".list"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>first_selection<span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">1</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>first_selection<span class="pl-kos">.</span>inner_html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>trim<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"<li>1</li><li>2</li><li>3</li>"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// this approach is consuming all nodes into vec at first, and then you can call `iter().next()` to get the first one.</span> <span class="pl-k">let</span> next_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".list"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">next</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>next_selection<span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">1</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>next_selection<span class="pl-kos">.</span>inner_html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>trim<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"<li>1</li><li>2</li><li>3</li>"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// currently, to get data from all matches you need to iterate over them, either:</span> <span class="pl-k">let</span> all_matched<span class="pl-kos">:</span> <span class="pl-smi">String</span> = selection<span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">map</span><span class="pl-kos">(</span>|s| s<span class="pl-kos">.</span><span class="pl-en">inner_html</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">trim</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">to_string</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">collect</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span> all_matched<span class="pl-kos">,</span> <span class="pl-s">"<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li>"</span> <span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// or:</span> <span class="pl-k">let</span> all_matched<span class="pl-kos">:</span> <span class="pl-smi">String</span> = selection<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">map</span><span class="pl-kos">(</span>|s| s<span class="pl-kos">.</span><span class="pl-en">inner_html</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">trim</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">to_string</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">collect</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> / which is more efficient<span class="pl-kos">.</span> <span class="pl-c1">assert_eq</span>!<span class="pl-kos">(</span> all_matched<span class="pl-kos">,</span> <span class="pl-s">"<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li>"</span> <span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Selecting descendent elements</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content=" use dom_query::Document; let html = r#"<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Test Page</title> </head> <body> <h1>Test Page</h1> <ul class="list-a"> <li>One</li> <li><a href="/2">Two</a></li> <li><a href="/3">Three</a></li> </ul> <ul class="list-b"> <li><a href="/4">Four</a></li> </ul> </body> </html>"#; let document = Document::from(html); // select a parent element let ul = document.select("ul"); // selecting multiple elements ul.select("li").iter().for_each(|el| { assert!(el.is("li")); }); // also descendant selector may be specified starting from the parent elements let el = ul.select("body ul.list-b li").first(); let text = el.text(); assert_eq!("Four", text.to_string()); "><pre> <span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"> <html></span> <span class="pl-s"> <head></span> <span class="pl-s"> <meta charset="utf-8"></span> <span class="pl-s"> <title>Test Page</title></span> <span class="pl-s"> </head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <h1>Test Page</h1></span> <span class="pl-s"> <ul class="list-a"></span> <span class="pl-s"> <li>One</li></span> <span class="pl-s"> <li><a href="/2">Two</a></li></span> <span class="pl-s"> <li><a href="/3">Three</a></li></span> <span class="pl-s"> </ul></span> <span class="pl-s"> <ul class="list-b"></span> <span class="pl-s"> <li><a href="/4">Four</a></li></span> <span class="pl-s"> </ul></span> <span class="pl-s"> </body></span> <span class="pl-s"> </html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> document = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// select a parent element</span> <span class="pl-k">let</span> ul = document<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"ul"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// selecting multiple elements</span> ul<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"li"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">for_each</span><span class="pl-kos">(</span>|el| <span class="pl-kos">{</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>el<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"li"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// also descendant selector may be specified starting from the parent elements</span> <span class="pl-k">let</span> el = ul<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"body ul.list-b li"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> text = el<span class="pl-kos">.</span><span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"Four"</span><span class="pl-kos">,</span> text<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Selecting ancestors</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let doc: Document = r#"<!DOCTYPE html> <html> <head>Test</head> <body> <div id="great-ancestor"> <div id="grand-parent"> <div id="parent"> <div id="child">Child</div> </div> </div> </div> </body> </html> "#.into(); // selecting an element let child_sel = doc.select("#child"); assert!(child_sel.exists()); let child_node = child_sel.nodes().first().unwrap(); // getting all ancestors let ancestors = child_node.ancestors(None); let ancestor_sel = Selection::from(ancestors); // or just: let ancestor_sel = child_sel.ancestors(None); // in this case ancestors includes all ancestral nodes including html // the root html element is presented in the ancestor selection assert!(ancestor_sel.is("html")); // also the direct parent of our starting node is presented assert!(ancestor_sel.is("#parent")); // `Selection::is` matches only the current selection without descending down the tree, // so it won't match the #child node. assert!(!ancestor_sel.is("#child")); // if you don't require all ancestors, you can specify a number of ancestors you need -- `max_limit` let ancestors = child_node.ancestors(Some(2)); let ancestor_sel = Selection::from(ancestors); // in this case ancestors includes only two ancestral nodes: #grand-parent and #parent assert!(ancestor_sel.is("#grand-parent #parent")); assert!(!ancestor_sel.is("#great-ancestor")); "><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc<span class="pl-kos">:</span> <span class="pl-smi">Document</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head>Test</head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <div id="great-ancestor"></span> <span class="pl-s"> <div id="grand-parent"></span> <span class="pl-s"> <div id="parent"></span> <span class="pl-s"> <div id="child">Child</div></span> <span class="pl-s"> </div></span> <span class="pl-s"> </div></span> <span class="pl-s"> </div></span> <span class="pl-s"> </body></span> <span class="pl-s"></html></span> <span class="pl-s">"#</span><span class="pl-kos">.</span><span class="pl-en">into</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// selecting an element</span> <span class="pl-k">let</span> child_sel = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"#child"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>child_sel<span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> child_node = child_sel<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// getting all ancestors</span> <span class="pl-k">let</span> ancestors = child_node<span class="pl-kos">.</span><span class="pl-en">ancestors</span><span class="pl-kos">(</span><span class="pl-v">None</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> ancestor_sel = <span class="pl-smi">Selection</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>ancestors<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// or just: let ancestor_sel = child_sel.ancestors(None);</span> <span class="pl-c">// in this case ancestors includes all ancestral nodes including html</span> <span class="pl-c">// the root html element is presented in the ancestor selection</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>ancestor_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"html"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// also the direct parent of our starting node is presented</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>ancestor_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"#parent"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// `Selection::is` matches only the current selection without descending down the tree,</span> <span class="pl-c">// so it won't match the #child node.</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!ancestor_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"#child"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// if you don't require all ancestors, you can specify a number of ancestors you need -- `max_limit`</span> <span class="pl-k">let</span> ancestors = child_node<span class="pl-kos">.</span><span class="pl-en">ancestors</span><span class="pl-kos">(</span><span class="pl-en">Some</span><span class="pl-kos">(</span><span class="pl-c1">2</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> ancestor_sel = <span class="pl-smi">Selection</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>ancestors<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// in this case ancestors includes only two ancestral nodes: #grand-parent and #parent</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>ancestor_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"#grand-parent #parent"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!ancestor_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"#great-ancestor"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Selecting with precompiled matchers (for reuse)</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::{Document, Matcher}; let html1 = r#"<!DOCTYPE html><html><head><title>Test Page 1</title></head><body></body></html>"#; let html2 = r#"<!DOCTYPE html><html><head><title>Test Page 2</title></head><body></body></html>"#; let doc1 = Document::from(html1); let doc2 = Document::from(html2); // create a matcher once, reuse on different documents let title_matcher = Matcher::new("title").unwrap(); let title_el1 = doc1.select_matcher(&title_matcher); assert_eq!(title_el1.text(), "Test Page 1".into()); let title_el2 = doc2.select_matcher(&title_matcher); assert_eq!(title_el2.text(), "Test Page 2".into()); // selecting a single match let title_single = doc1.select_single_matcher(&title_matcher); assert_eq!(title_single.text(), "Test Page 1".into());"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-kos">{</span><span class="pl-v">Document</span><span class="pl-kos">,</span> <span class="pl-v">Matcher</span><span class="pl-kos">}</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html1 = <span class="pl-s">r#"<!DOCTYPE html><html><head><title>Test Page 1</title></head><body></body></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html2 = <span class="pl-s">r#"<!DOCTYPE html><html><head><title>Test Page 2</title></head><body></body></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc1 = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html1<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc2 = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html2<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// create a matcher once, reuse on different documents</span> <span class="pl-k">let</span> title_matcher = <span class="pl-smi">Matcher</span><span class="pl-kos">::</span><span class="pl-en">new</span><span class="pl-kos">(</span><span class="pl-s">"title"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> title_el1 = doc1<span class="pl-kos">.</span><span class="pl-en">select_matcher</span><span class="pl-kos">(</span><span class="pl-c1">&</span>title_matcher<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>title_el1<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Test Page 1"</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> title_el2 = doc2<span class="pl-kos">.</span><span class="pl-en">select_matcher</span><span class="pl-kos">(</span><span class="pl-c1">&</span>title_matcher<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>title_el2<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Test Page 2"</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// selecting a single match</span> <span class="pl-k">let</span> title_single = doc1<span class="pl-kos">.</span><span class="pl-en">select_single_matcher</span><span class="pl-kos">(</span><span class="pl-c1">&</span>title_matcher<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>title_single<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Test Page 1"</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Selecting with pseudo-classes (:has, :has-text, :contains, :only-text)</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html = include_str!("../test-pages/rustwiki_2024.html"); let doc = Document::from(html); // searching list items inside a `tr` element which has a `a` element // with title="Programming paradigm" let paradigm_selection = doc.select( r#"table tr:has(a[title="Programming paradigm"]) td.infobox-data ul > li"# ); println!("Rust programming paradigms:"); for item in paradigm_selection.iter() { println!(" {}", item.text()); } println!("{:-<50}", ""); //since `th` contains text "Paradigms" without sibling tags, we can use `:has-text` pseudo class let influenced_by_selection = doc.select(r#"table tr:has-text("Influenced by") + tr td ul > li > a"#); println!("Rust influenced by:"); for item in influenced_by_selection.iter() { println!(" {}", item.text()); } println!("{:-<50}", ""); // Extract all links from the block that contains certain text. // Since `foreign function interface` located in its own tag, // we have to use `:contains` pseudo class let links_selection = doc.select( r#"p:contains("Rust has a foreign function interface") a[href^="/"]"# ); println!("Links in the FFI block:"); for item in links_selection.iter() { println!(" {}", item.attr("href").unwrap()); } println!("{:-<50}", ""); // :only-text selects an element that contains only a single text node, // with no child elements. // It can be combined with other pseudo-classes to achieve more specific selections. // For example, to select a <div> inside an <a> //that has no siblings and no child elements other than text. println!("Single <div> inside an <a> with text only:"); for el in doc.select("a div:only-text:only-child").iter() { println!("{}", el.text().trim()); }"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-en">include_str</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"../test-pages/rustwiki_2024.html"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// searching list items inside a `tr` element which has a `a` element </span> <span class="pl-c">// with title="Programming paradigm"</span> <span class="pl-k">let</span> paradigm_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span> <span class="pl-s">r#"table tr:has(a[title="Programming paradigm"]) td.infobox-data ul > li"#</span> <span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"Rust programming paradigms:"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">for</span> item <span class="pl-k">in</span> paradigm_selection<span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">" {}"</span><span class="pl-kos">,</span> item<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"{:-<50}"</span><span class="pl-kos">,</span> <span class="pl-s">""</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//since `th` contains text "Paradigms" without sibling tags, we can use `:has-text` pseudo class</span> <span class="pl-k">let</span> influenced_by_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">r#"table tr:has-text("Influenced by") + tr td ul > li > a"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"Rust influenced by:"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">for</span> item <span class="pl-k">in</span> influenced_by_selection<span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">" {}"</span><span class="pl-kos">,</span> item<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"{:-<50}"</span><span class="pl-kos">,</span> <span class="pl-s">""</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Extract all links from the block that contains certain text.</span> <span class="pl-c">// Since `foreign function interface` located in its own tag,</span> <span class="pl-c">// we have to use `:contains` pseudo class</span> <span class="pl-k">let</span> links_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span> <span class="pl-s">r#"p:contains("Rust has a foreign function interface") a[href^="/"]"#</span> <span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"Links in the FFI block:"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">for</span> item <span class="pl-k">in</span> links_selection<span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">" {}"</span><span class="pl-kos">,</span> item<span class="pl-kos">.</span>attr<span class="pl-kos">(</span><span class="pl-s">"href"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>unwrap<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"{:-<50}"</span><span class="pl-kos">,</span> <span class="pl-s">""</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// :only-text selects an element that contains only a single text node,</span> <span class="pl-c">// with no child elements.</span> <span class="pl-c">// It can be combined with other pseudo-classes to achieve more specific selections.</span> <span class="pl-c">// For example, to select a <div> inside an <a> </span> <span class="pl-c">//that has no siblings and no child elements other than text.</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"Single <div> inside an <a> with text only:"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">for</span> el <span class="pl-k">in</span> doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"a div:only-text:only-child"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">iter</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-en">println</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">"{}"</span><span class="pl-kos">,</span> el<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>trim<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span></pre></div> </details> <details> <summary><b>Serializing to HTML</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body><div class="content"><h1>Test Page</h1></div></body> </html>"#; let doc = Document::from(html); let heading_selector = doc.select("div.content"); // serializing including the outer html tag let content = heading_selector.html(); assert_eq!(content.to_string(), r#"<div class="content"><h1>Test Page</h1></div>"#); // serializing without the outer html tag let inner_content = heading_selector.inner_html(); assert_eq!(inner_content.to_string(), "<h1>Test Page</h1>"); // there is also `try_html()` method, which returns an `Option<StrTendril>`, // and if there is no matching selection it returns None let opt_no_content = doc.select("div.no-content").try_html(); assert_eq!(opt_no_content, None); //`html()` method will return an empty `StrTendril` if there is no matching selection let no_content = doc.select("div.no-content").html(); assert_eq!(no_content, "".into()); //Same things works for `inner_html()` and `try_inner_html()` method. assert_eq!(doc.select("div.no-content").try_inner_html(), None); assert_eq!(doc.select("div.no-content").inner_html(), "".into());"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head><title>Test</title></head></span> <span class="pl-s"> <body><div class="content"><h1>Test Page</h1></div></body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> heading_selector = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"div.content"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// serializing including the outer html tag</span> <span class="pl-k">let</span> content = heading_selector<span class="pl-kos">.</span><span class="pl-en">html</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>content<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">r#"<div class="content"><h1>Test Page</h1></div>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// serializing without the outer html tag</span> <span class="pl-k">let</span> inner_content = heading_selector<span class="pl-kos">.</span><span class="pl-en">inner_html</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>inner_content<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"<h1>Test Page</h1>"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// there is also `try_html()` method, which returns an `Option<StrTendril>`,</span> <span class="pl-c">// and if there is no matching selection it returns None</span> <span class="pl-k">let</span> opt_no_content = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"div.no-content"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">try_html</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>opt_no_content<span class="pl-kos">,</span> <span class="pl-v">None</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//`html()` method will return an empty `StrTendril` if there is no matching selection</span> <span class="pl-k">let</span> no_content = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"div.no-content"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">html</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>no_content<span class="pl-kos">,</span> <span class="pl-s">""</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//Same things works for `inner_html()` and `try_inner_html()` method.</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"div.no-content"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>try_inner_html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-v">None</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"div.no-content"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>inner_html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">""</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Accessing descendent text</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body><div><h1>Test <span>Page</span></h1></div></body> </html>"#; let doc = Document::from(html); let body_selection = doc.select("body div").first(); let text = body_selection.text(); assert_eq!(text.to_string(), "Test Page");"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head><title>Test</title></head></span> <span class="pl-s"> <body><div><h1>Test <span>Page</span></h1></div></body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> body_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"body div"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> text = body_selection<span class="pl-kos">.</span><span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>text<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Test Page"</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Accessing immediate text</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body><div><h1>Test <span>Page</span></h1></div></body> </html>"#; let doc = Document::from(html); let body_selection = doc.select("body div h1").first(); // accessing immediate text without descendants let text = body_selection.immediate_text(); assert_eq!(text.to_string(), "Test "); "><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head><title>Test</title></head></span> <span class="pl-s"> <body><div><h1>Test <span>Page</span></h1></div></body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> body_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"body div h1"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// accessing immediate text without descendants</span> <span class="pl-k">let</span> text = body_selection<span class="pl-kos">.</span><span class="pl-en">immediate_text</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>text<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Test "</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Manipulating the attribute of an HTML element</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body><input hidden="" id="k" class="important" type="hidden" name="k" data-k="100"></body> </html>"#; let doc = Document::from(html); let mut input_selection = doc.select("input[name=k]"); // get the value of attribute "data-k" let val = input_selection.attr("data-k").unwrap(); assert_eq!(val.to_string(), "100"); // remove the attribute "data-k" from the element input_selection.remove_attr("data-k"); // get the value of attribute "data-k", if missing, return default value let val_or = input_selection.attr_or("data-k", "0"); assert_eq!(val_or.to_string(), "0"); // remove a list of attributes from the element input_selection.remove_attrs(&["id", "class"]); // set a attribute "data-k" with value "200" input_selection.set_attr("data-k", "200"); assert_eq!(input_selection.html(), r#"<input hidden="" type="hidden" name="k" data-k="200">"#.into()); // check if attribute "hidden" exists on the element let is_hidden = input_selection.has_attr("hidden"); assert!(is_hidden); let has_title = input_selection.has_attr("title"); assert!(!has_title); // remove all attributes from the element input_selection.remove_all_attrs(); assert_eq!(input_selection.html(), r#"<input>"#.into()); "><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head><title>Test</title></head></span> <span class="pl-s"> <body><input hidden="" id="k" class="important" type="hidden" name="k" data-k="100"></body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> <span class="pl-k">mut</span> input_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"input[name=k]"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// get the value of attribute "data-k"</span> <span class="pl-k">let</span> val = input_selection<span class="pl-kos">.</span><span class="pl-en">attr</span><span class="pl-kos">(</span><span class="pl-s">"data-k"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>val<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"100"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// remove the attribute "data-k" from the element</span> input_selection<span class="pl-kos">.</span><span class="pl-en">remove_attr</span><span class="pl-kos">(</span><span class="pl-s">"data-k"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// get the value of attribute "data-k", if missing, return default value</span> <span class="pl-k">let</span> val_or = input_selection<span class="pl-kos">.</span><span class="pl-en">attr_or</span><span class="pl-kos">(</span><span class="pl-s">"data-k"</span><span class="pl-kos">,</span> <span class="pl-s">"0"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>val_or<span class="pl-kos">.</span>to_string<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"0"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// remove a list of attributes from the element</span> input_selection<span class="pl-kos">.</span><span class="pl-en">remove_attrs</span><span class="pl-kos">(</span><span class="pl-c1">&</span><span class="pl-kos">[</span><span class="pl-s">"id"</span><span class="pl-kos">,</span> <span class="pl-s">"class"</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// set a attribute "data-k" with value "200"</span> input_selection<span class="pl-kos">.</span><span class="pl-en">set_attr</span><span class="pl-kos">(</span><span class="pl-s">"data-k"</span><span class="pl-kos">,</span> <span class="pl-s">"200"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>input_selection<span class="pl-kos">.</span>html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">r#"<input hidden="" type="hidden" name="k" data-k="200">"#</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// check if attribute "hidden" exists on the element</span> <span class="pl-k">let</span> is_hidden = input_selection<span class="pl-kos">.</span><span class="pl-en">has_attr</span><span class="pl-kos">(</span><span class="pl-s">"hidden"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>is_hidden<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> has_title = input_selection<span class="pl-kos">.</span><span class="pl-en">has_attr</span><span class="pl-kos">(</span><span class="pl-s">"title"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!has_title<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// remove all attributes from the element</span> input_selection<span class="pl-kos">.</span><span class="pl-en">remove_all_attrs</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>input_selection<span class="pl-kos">.</span>html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">r#"<input>"#</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Manipulating the DOM</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let html_contents = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body> <div class="content"> </div> <div class="remove-it"> Remove me </div> <div class="replace-it"> <div>Replace me</div> </div> </body> </html>"#;; let doc = Document::from(html_contents); let mut content_selection = doc.select("body .content"); // append a new html node to the selection content_selection.append_html(r#"<div class="inner">inner block</div>"#); assert!(doc.select("body .content .inner").exists()); // set a new content to the selection, replacing existing content let mut set_selection = doc.select(".inner"); set_selection.set_html(r#"<p>1,2,3</p>"#); assert_eq!(doc.select(".inner").html(), r#"<div class="inner"><p>1,2,3</p></div>"#.into()); // remove the selection doc.select(".remove-it").remove(); assert!(!doc.select(".remove-it").exists()); // replace the selection with a new html, current selection will not change. let mut replace_selection = doc.select(".replace-it"); replace_selection.replace_with_html(r#"<div class="replaced">Replaced</div>"#); assert_eq!(replace_selection.text().trim(), "Replace me"); //but the document will change assert_eq!(doc.select(".replaced").text(),"Replaced".into()); //instead of appending content, you can prepend it let mut content_selection = doc.select_single("body .content"); // you can prepend one element or, content_selection.prepend_html(r#"<p class="third">3</p>"#); // more: content_selection.prepend_html(r#"<p class="first">2</p><p class="second">2</p>"#); // Also you can insert html before selection: let first = content_selection.select(".first"); first.before_html(r#"<p class="none">None</p>"#); // or after: let third = content_selection.select(".third"); third.after_html(r#"<p class="fourth">4</p>"#); // now the added paragraphs standing in front of `div` assert!(doc.select(r#".content > .none + .first + .second + .third + .fourth + div:has-text("1,2,3")"#).exists()); // to set a text to the selection you can use `set_html` but `set_text` is preferable: let p_sel = content_selection.select("p"); let total_p = p_sel.length(); p_sel.set_text("test content"); assert_eq!(doc.select(r#"p:has-text("test content")"#).length(), total_p); "><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> html_contents = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"> <html></span> <span class="pl-s"> <head><title>Test</title></head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <div class="content"></span> <span class="pl-s"> </div></span> <span class="pl-s"> <div class="remove-it"></span> <span class="pl-s"> Remove me</span> <span class="pl-s"> </div></span> <span class="pl-s"> <div class="replace-it"></span> <span class="pl-s"> <div>Replace me</div></span> <span class="pl-s"> </div></span> <span class="pl-s"> </body></span> <span class="pl-s"> </html>"#</span><span class="pl-kos">;</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>html_contents<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> <span class="pl-k">mut</span> content_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"body .content"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// append a new html node to the selection</span> content_selection<span class="pl-kos">.</span><span class="pl-en">append_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<div class="inner">inner block</div>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"body .content .inner"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// set a new content to the selection, replacing existing content</span> <span class="pl-k">let</span> <span class="pl-k">mut</span> set_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".inner"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> set_selection<span class="pl-kos">.</span><span class="pl-en">set_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p>1,2,3</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">".inner"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>html<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">r#"<div class="inner"><p>1,2,3</p></div>"#</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// remove the selection</span> doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".remove-it"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">remove</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">".remove-it"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// replace the selection with a new html, current selection will not change.</span> <span class="pl-k">let</span> <span class="pl-k">mut</span> replace_selection = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".replace-it"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> replace_selection<span class="pl-kos">.</span><span class="pl-en">replace_with_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<div class="replaced">Replaced</div>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>replace_selection<span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>trim<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Replace me"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//but the document will change</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">".replaced"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span><span class="pl-s">"Replaced"</span><span class="pl-kos">.</span>into<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">//instead of appending content, you can prepend it</span> <span class="pl-k">let</span> <span class="pl-k">mut</span> content_selection = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">"body .content"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// you can prepend one element or,</span> content_selection<span class="pl-kos">.</span><span class="pl-en">prepend_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p class="third">3</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// more:</span> content_selection<span class="pl-kos">.</span><span class="pl-en">prepend_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p class="first">2</p><p class="second">2</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Also you can insert html before selection:</span> <span class="pl-k">let</span> first = content_selection<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".first"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> first<span class="pl-kos">.</span><span class="pl-en">before_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p class="none">None</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// or after:</span> <span class="pl-k">let</span> third = content_selection<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">".third"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> third<span class="pl-kos">.</span><span class="pl-en">after_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p class="fourth">4</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// now the added paragraphs standing in front of `div`</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">r#".content > .none + .first + .second + .third + .fourth + div:has-text("1,2,3")"#</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// to set a text to the selection you can use `set_html` but `set_text` is preferable:</span> <span class="pl-k">let</span> p_sel = content_selection<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"p"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> total_p = p_sel<span class="pl-kos">.</span><span class="pl-en">length</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> p_sel<span class="pl-kos">.</span><span class="pl-en">set_text</span><span class="pl-kos">(</span><span class="pl-s">"test content"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">r#"p:has-text("test content")"#</span><span class="pl-kos">)</span><span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> total_p<span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Node manipulations: Creating an empty element, adding a single element to a single node</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let doc: Document = r#"<!DOCTYPE html> <html lang="en"> <head></head> <body> <div id="main"> <p id="first">It's</p> </div> </body> </html>"#.into(); // selecting a node we want to attach a new element let main_sel = doc.select_single("#main"); let main_node = main_sel.nodes().first().unwrap(); // if you need just to create a simple element, then you can use the following: let el = doc.tree.new_element("p"); // you still able to deal with element's attributes: el.set_attr("id", "second"); // and set text el.set_text("test"); main_node.append_child(&el); // also main_node.append_child(&el); assert!(doc.select(r#"#main #second:has-text("test")"#).exists()); // because this method doesn't parse anything it is much more cheaper than following approaches. // if you need to add a more complex element, you can use `node.append_html`, // which is much more convenient, then previous approach: main_node.append_html(r#"<p id="third">Wonderful</p>"#); assert_eq!(doc.select("#main #third").text().as_ref(), "Wonderful"); // There is also a `prepend_child` and `prepend_html` methods which allows // to insert content to the begging of the node. main_node.prepend_html(r#"<p id="minus-one">-1</p><p id="zero">0</p>"#); assert!(doc.select("#main > #minus-one + #zero + #first + #second + #third").exists()); // if we need to replace existing element content inside a node with a new one, then use `node.set_html`. // It changes the inner html contents of the node. main_node.set_html(r#"<p id="the-only">Wonderful</p>"#); assert_eq!(doc.select("#main #the-only").text().as_ref(), "Wonderful"); assert!(!doc.select("#first").exists()); // To completely replace contents of the node, // including itself use `node.replace_with_html`. // Also we can specify more than one element in the string for methods // like `replace_with_html`, `set_html` and `append_html`. main_node.replace_with_html(r#"<span>Tweedledum</span> and <span>Tweedledee</span>"#); assert!(!doc.select("#main").exists()); assert_eq!(doc.select("span + span").text().as_ref(), "Tweedledee");"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc<span class="pl-kos">:</span> <span class="pl-smi">Document</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html lang="en"></span> <span class="pl-s"><head></head></span> <span class="pl-s"><body></span> <span class="pl-s"> <div id="main"></span> <span class="pl-s"> <p id="first">It's</p></span> <span class="pl-s"> </div></span> <span class="pl-s"></body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">.</span><span class="pl-en">into</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// selecting a node we want to attach a new element</span> <span class="pl-k">let</span> main_sel = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">"#main"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> main_node = main_sel<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// if you need just to create a simple element, then you can use the following:</span> <span class="pl-k">let</span> el = doc<span class="pl-kos">.</span><span class="pl-c1">tree</span><span class="pl-kos">.</span><span class="pl-en">new_element</span><span class="pl-kos">(</span><span class="pl-s">"p"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// you still able to deal with element's attributes:</span> el<span class="pl-kos">.</span><span class="pl-en">set_attr</span><span class="pl-kos">(</span><span class="pl-s">"id"</span><span class="pl-kos">,</span> <span class="pl-s">"second"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// and set text</span> el<span class="pl-kos">.</span><span class="pl-en">set_text</span><span class="pl-kos">(</span><span class="pl-s">"test"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> main_node<span class="pl-kos">.</span><span class="pl-en">append_child</span><span class="pl-kos">(</span><span class="pl-c1">&</span>el<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// also main_node.append_child(&el);</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">r#"#main #second:has-text("test")"#</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// because this method doesn't parse anything it is much more cheaper than following approaches.</span> <span class="pl-c">// if you need to add a more complex element, you can use `node.append_html`,</span> <span class="pl-c">// which is much more convenient, then previous approach:</span> main_node<span class="pl-kos">.</span><span class="pl-en">append_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p id="third">Wonderful</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"#main #third"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Wonderful"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// There is also a `prepend_child` and `prepend_html` methods which allows</span> <span class="pl-c">// to insert content to the begging of the node.</span> main_node<span class="pl-kos">.</span><span class="pl-en">prepend_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p id="minus-one">-1</p><p id="zero">0</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"#main > #minus-one + #zero + #first + #second + #third"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// if we need to replace existing element content inside a node with a new one, then use `node.set_html`.</span> <span class="pl-c">// It changes the inner html contents of the node.</span> main_node<span class="pl-kos">.</span><span class="pl-en">set_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<p id="the-only">Wonderful</p>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"#main #the-only"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Wonderful"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"#first"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// To completely replace contents of the node, </span> <span class="pl-c">// including itself use `node.replace_with_html`.</span> <span class="pl-c">// Also we can specify more than one element in the string for methods </span> <span class="pl-c">// like `replace_with_html`, `set_html` and `append_html`.</span> main_node<span class="pl-kos">.</span><span class="pl-en">replace_with_html</span><span class="pl-kos">(</span><span class="pl-s">r#"<span>Tweedledum</span> and <span>Tweedledee</span>"#</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"#main"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>exists<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"span + span"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>text<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"Tweedledee"</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Renaming selected elements without changing the contents</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let doc: Document = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body> <div class="content"> <div>1</div> <div>2</div> <div>3</div> <span>4</span> </div> <body> </html>"# .into(); let mut sel = doc.select("div.content > div, div.content > span"); // before renaming, there are 3 `div` and 1 `span` assert_eq!(sel.length(), 4); sel.rename("p"); // after renaming, there are no `div` and `span` elements assert_eq!(doc.select("div.content > div, div.content > span").length(), 0); // but there are four `p` elements assert_eq!(doc.select("div.content > p").length(), 4);"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc<span class="pl-kos">:</span> <span class="pl-smi">Document</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"><head><title>Test</title></head></span> <span class="pl-s"><body></span> <span class="pl-s"> <div class="content"></span> <span class="pl-s"> <div>1</div></span> <span class="pl-s"> <div>2</div></span> <span class="pl-s"> <div>3</div></span> <span class="pl-s"> <span>4</span></span> <span class="pl-s"> </div></span> <span class="pl-s"><body></span> <span class="pl-s"></html>"#</span> <span class="pl-kos">.</span><span class="pl-en">into</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> <span class="pl-k">mut</span> sel = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"div.content > div, div.content > span"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// before renaming, there are 3 `div` and 1 `span`</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>sel<span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">4</span><span class="pl-kos">)</span><span class="pl-kos">;</span> sel<span class="pl-kos">.</span><span class="pl-en">rename</span><span class="pl-kos">(</span><span class="pl-s">"p"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// after renaming, there are no `div` and `span` elements</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"div.content > div, div.content > span"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">0</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// but there are four `p` elements</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>doc<span class="pl-kos">.</span>select<span class="pl-kos">(</span><span class="pl-s">"div.content > p"</span><span class="pl-kos">)</span><span class="pl-kos">.</span>length<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-c1">4</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Retrieving The Base URI</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let contents: &str = r#"<!DOCTYPE html> <html> <head> <base href="https://www.example.com/"/> <title>Test</title> </head> <body> <div id="main"></div> </body> </html>"#; let doc = Document::from(contents); // This method is a much faster alternative to // `doc.select("html > head > base").attr("href")`. // Currently, it does not cache the result, so each time you call it, // it will traverse the tree again. // The reason it is not cached is to keep `Document` implementing the `Send` trait. // It may be called from the document level. let base_uri = doc.base_uri().unwrap(); assert_eq!(base_uri.as_ref(), "https://www.example.com/"); let sel = doc.select_single("#main"); let node = sel.nodes().first().unwrap(); // Also it is accessible from any node of the tree. let base_uri = node.base_uri().unwrap(); assert_eq!(base_uri.as_ref(), "https://www.example.com/");"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents<span class="pl-kos">:</span> <span class="pl-c1">&</span><span class="pl-smi">str</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head></span> <span class="pl-s"> <base href="https://www.example.com/"/></span> <span class="pl-s"> <title>Test</title></span> <span class="pl-s"> </head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <div id="main"></div></span> <span class="pl-s"> </body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// This method is a much faster alternative to </span> <span class="pl-c">// `doc.select("html > head > base").attr("href")`.</span> <span class="pl-c">// Currently, it does not cache the result, so each time you call it, </span> <span class="pl-c">// it will traverse the tree again.</span> <span class="pl-c">// The reason it is not cached is to keep `Document` implementing the `Send` trait.</span> <span class="pl-c">// It may be called from the document level.</span> <span class="pl-k">let</span> base_uri = doc<span class="pl-kos">.</span><span class="pl-en">base_uri</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>base_uri<span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"https://www.example.com/"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> sel = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">"#main"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> node = sel<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Also it is accessible from any node of the tree.</span> <span class="pl-k">let</span> base_uri = node<span class="pl-kos">.</span><span class="pl-en">base_uri</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>base_uri<span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">"https://www.example.com/"</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Verifying Selection and Node Matches</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let contents: &str = r#"<!DOCTYPE html> <html> <head> <title>Test</title> </head> <body> <div id="main" dir="ltr"></div> <div id="extra"></div> </body> </html>"#; let doc = Document::from(contents); let main_sel = doc.select_single("#main"); let extra_sel = doc.select_single("#extra"); // The `is()` method is available for `Selection` and `NodeRef`. // For `Selection`, it verifies that at least one of the nodes in the selection // matches the selector. assert!(main_sel.is("div#main")); assert!(!extra_sel.is("div#main")); // For `NodeRef`, the `is` method verifies that the node matches the selector. // This method is useful if you need to combine several checks into one expression. // It can check for having a certain position in the DOM tree, // having a certain attribute, or a certain element name all at once. let main_node = main_sel.nodes().first().unwrap(); let extra_node = extra_sel.nodes().first().unwrap(); assert!(main_node.is("html > body > div#main[dir=ltr]")); assert!(extra_node.is("html > body > div#main + div"));"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents<span class="pl-kos">:</span> <span class="pl-c1">&</span><span class="pl-smi">str</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head></span> <span class="pl-s"> <title>Test</title></span> <span class="pl-s"> </head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <div id="main" dir="ltr"></div></span> <span class="pl-s"> <div id="extra"></div></span> <span class="pl-s"> </body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> main_sel = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">"#main"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> extra_sel = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">"#extra"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// The `is()` method is available for `Selection` and `NodeRef`.</span> <span class="pl-c">// For `Selection`, it verifies that at least one of the nodes in the selection</span> <span class="pl-c">// matches the selector.</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>main_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"div#main"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>!extra_sel<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"div#main"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// For `NodeRef`, the `is` method verifies that the node matches the selector.</span> <span class="pl-c">// This method is useful if you need to combine several checks into one expression. </span> <span class="pl-c">// It can check for having a certain position in the DOM tree,</span> <span class="pl-c">// having a certain attribute, or a certain element name all at once.</span> <span class="pl-k">let</span> main_node = main_sel<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> extra_node = extra_sel<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>main_node<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"html > body > div#main[dir=ltr]"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert</span><span class="pl-en">!</span><span class="pl-kos">(</span>extra_node<span class="pl-kos">.</span>is<span class="pl-kos">(</span><span class="pl-s">"html > body > div#main + div"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Fast Finding Child Elements</b></summary> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let doc: Document = r#"<!DOCTYPE html> <html> <head><title>Test</title></head> <body> <div id="main"></div> </body> </html>"#.into(); let main_sel = doc.select_single("#main"); let main_node = main_sel.nodes().first().unwrap(); // create 10 child blocks with links let total_links = 10usize; for i in 0..total_links { let content = format!(r#"<div><a href="/{0}">{0} link</a></div>"#, i); main_node.append_html(content); } let selected_count = doc.select("html body a").nodes().len(); assert_eq!(selected_count, total_links); // `find` currently can deal only with paths that start after the current node. // In the following example, `&["html", "body", "div", "a"]` will fail, // while `&["a"]` or `&["div", "a"]` are okay. let found_count = main_node.find(&["div", "a"]).len(); assert_eq!(found_count, total_links);"><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc<span class="pl-kos">:</span> <span class="pl-smi">Document</span> = <span class="pl-s">r#"<!DOCTYPE html></span> <span class="pl-s"><html></span> <span class="pl-s"> <head><title>Test</title></head></span> <span class="pl-s"> <body></span> <span class="pl-s"> <div id="main"></div></span> <span class="pl-s"> </body></span> <span class="pl-s"></html>"#</span><span class="pl-kos">.</span><span class="pl-en">into</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> main_sel = doc<span class="pl-kos">.</span><span class="pl-en">select_single</span><span class="pl-kos">(</span><span class="pl-s">"#main"</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> main_node = main_sel<span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">first</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">unwrap</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// create 10 child blocks with links</span> <span class="pl-k">let</span> total_links = <span class="pl-c1">10usize</span><span class="pl-kos">;</span> <span class="pl-k">for</span> i <span class="pl-k">in</span> <span class="pl-c1">0</span>..total_links <span class="pl-kos">{</span> <span class="pl-k">let</span> content = <span class="pl-en">format</span><span class="pl-en">!</span><span class="pl-kos">(</span><span class="pl-s">r#"<div><a href="/{0}">{0} link</a></div>"#</span><span class="pl-kos">,</span> i<span class="pl-kos">)</span><span class="pl-kos">;</span> main_node<span class="pl-kos">.</span><span class="pl-en">append_html</span><span class="pl-kos">(</span>content<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-k">let</span> selected_count = doc<span class="pl-kos">.</span><span class="pl-en">select</span><span class="pl-kos">(</span><span class="pl-s">"html body a"</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">nodes</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">len</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>selected_count<span class="pl-kos">,</span> total_links<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// `find` currently can deal only with paths that start after the current node. </span> <span class="pl-c">// In the following example, `&["html", "body", "div", "a"]` will fail,</span> <span class="pl-c">// while `&["a"]` or `&["div", "a"]` are okay.</span> <span class="pl-k">let</span> found_count = main_node<span class="pl-kos">.</span><span class="pl-en">find</span><span class="pl-kos">(</span><span class="pl-c1">&</span><span class="pl-kos">[</span><span class="pl-s">"div"</span><span class="pl-kos">,</span> <span class="pl-s">"a"</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">len</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>found_count<span class="pl-kos">,</span> total_links<span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <details> <summary><b>Serializing a document to Markdown</b></summary> <p dir="auto"><em>This example requires <code>markdown</code> feature.</em></p> <div class="highlight highlight-source-rust notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="use dom_query::Document; let contents = " <style>p {color: blue;}</style> <p>I really like using <b>Markdown</b>.</p> <p>I think I'll use it to format all of my documents from now on.</p>"; let expected = "I really like using **Markdown**\\.\n\n\ I think I'll use it to format all of my documents from now on\\."; let doc = Document::from(contents); // Passing `None` into md allows to use default skip tags, which are: // `["script", "style", "meta", "head"]`. let got = doc.md(None); assert_eq!(got.as_ref(), expected); // If you need the full text content of the elements, pass `Some(&vec![])` to `md`. // If you pass content like the example below to `Document::from`, // `html5ever` will create a `<head>` element and place your `<style>` element inside it. // To preserve the original order, use `Document::fragment`. let contents = "<style>p {color: blue;}</style>\ <div><h1>Content Heading<h1></div>\ <p>I really like using Markdown.</p>\ <p>I think I'll use it to format all of my documents from now on.</p>"; let expected = "p \\{color: blue;\\}\n\ I really like using Markdown\\.\n\n\ I think I'll use it to format all of my documents from now on\\."; let doc = Document::fragment(contents); let got = doc.md(Some(&["div"])); assert_eq!(got.as_ref(), expected); "><pre><span class="pl-k">use</span> dom_query<span class="pl-kos">::</span><span class="pl-v">Document</span><span class="pl-kos">;</span> <span class="pl-k">let</span> contents = <span class="pl-s">"</span> <span class="pl-s"><style>p {color: blue;}</style></span> <span class="pl-s"><p>I really like using <b>Markdown</b>.</p></span> <span class="pl-s"></span> <span class="pl-s"><p>I think I'll use it to format all of my documents from now on.</p>"</span><span class="pl-kos">;</span> <span class="pl-k">let</span> expected = <span class="pl-s">"I really like using **Markdown**<span class="pl-cce">\\</span>.<span class="pl-cce">\n</span><span class="pl-cce">\n</span><span class="pl-cce">\</span></span> <span class="pl-s"><span class="pl-cce"></span>I think I'll use it to format all of my documents from now on<span class="pl-cce">\\</span>."</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">from</span><span class="pl-kos">(</span>contents<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Passing `None` into md allows to use default skip tags, which are: </span> <span class="pl-c">// `["script", "style", "meta", "head"]`.</span> <span class="pl-k">let</span> got = doc<span class="pl-kos">.</span><span class="pl-en">md</span><span class="pl-kos">(</span><span class="pl-v">None</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>got<span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> expected<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// If you need the full text content of the elements, pass `Some(&vec![])` to `md`.</span> <span class="pl-c">// If you pass content like the example below to `Document::from`,</span> <span class="pl-c">// `html5ever` will create a `<head>` element and place your `<style>` element inside it.</span> <span class="pl-c">// To preserve the original order, use `Document::fragment`.</span> <span class="pl-k">let</span> contents = <span class="pl-s">"<style>p {color: blue;}</style><span class="pl-cce">\</span></span> <span class="pl-s"><span class="pl-cce"></span><div><h1>Content Heading<h1></div><span class="pl-cce">\</span></span> <span class="pl-s"><span class="pl-cce"></span><p>I really like using Markdown.</p><span class="pl-cce">\</span></span> <span class="pl-s"><span class="pl-cce"></span><p>I think I'll use it to format all of my documents from now on.</p>"</span><span class="pl-kos">;</span> <span class="pl-k">let</span> expected = <span class="pl-s">"p <span class="pl-cce">\\</span>{color: blue;<span class="pl-cce">\\</span>}<span class="pl-cce">\n</span><span class="pl-cce">\</span></span> <span class="pl-s"><span class="pl-cce"></span>I really like using Markdown<span class="pl-cce">\\</span>.<span class="pl-cce">\n</span><span class="pl-cce">\n</span><span class="pl-cce">\</span></span> <span class="pl-s"><span class="pl-cce"></span>I think I'll use it to format all of my documents from now on<span class="pl-cce">\\</span>."</span><span class="pl-kos">;</span> <span class="pl-k">let</span> doc = <span class="pl-smi">Document</span><span class="pl-kos">::</span><span class="pl-en">fragment</span><span class="pl-kos">(</span>contents<span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-k">let</span> got = doc<span class="pl-kos">.</span><span class="pl-en">md</span><span class="pl-kos">(</span><span class="pl-en">Some</span><span class="pl-kos">(</span><span class="pl-c1">&</span><span class="pl-kos">[</span><span class="pl-s">"div"</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-en">assert_eq</span><span class="pl-en">!</span><span class="pl-kos">(</span>got<span class="pl-kos">.</span>as_ref<span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">,</span> expected<span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div> </details> <ul dir="auto"> <li><strong><a href="/niklak/dom_query/blob/main/examples">more examples</a></strong></li> <li><strong><a href="https://niklak.github.io/dom_query_by_example/" rel="nofollow">dom_query by example</a></strong></li> </ul> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Related projects</h2><a id="user-content-related-projects" class="anchor" aria-label="Permalink: Related projects" href="#related-projects"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <ul dir="auto"> <li><a href="https://crates.io/crates/html5ever" rel="nofollow">html5ever</a></li> <li><a href="https://crates.io/crates/selectors" rel="nofollow">selectors</a></li> <li><a href="https://crates.io/crates/select" rel="nofollow">select.rs</a></li> <li><a href="https://godoc.org/github.com/PuerkitoBio/goquery" rel="nofollow">goquery</a></li> <li><a href="https://crates.io/crates/dom_finder" rel="nofollow">dom_finder</a></li> </ul> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Crate features</h2><a id="user-content-crate-features" class="anchor" aria-label="Permalink: Crate features" href="#crate-features"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <ul dir="auto"> <li><code>hashbrown</code> — optional,replaces standard hashmaps and hashsets with <code>hashbrown</code> hashmaps and hashsets.</li> <li><code>atomic</code> — optional, switches <code>NodeData</code> from using <code>StrTendril</code> to <code>Tendril<tendril::fmt::UTF8, tendril::Atomic></code>. This allows <code>NodeData</code> and all ascending structures, including <code>Document</code>, to implement the <code>Send</code> trait;</li> <li><code>markdown</code> — optional, enables the <code>Document::md</code> and <code>NodeRef::md</code> methods, allowing serialization of a document or node to <code>Markdown</code> text.</li> <li><code>mini_selector</code> — optional, provides a lightweight and faster alternative for element matching with limited CSS selector support.<br> This includes additional <code>NodeRef</code> methods: <code>find_descendants</code>, <code>try_find_descendants</code>, <code>mini_is</code>, and <code>mini_match</code>.<br> <em>This is an experimental feature that may change in future releases.</em></li> </ul> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Possible issues</h2><a id="user-content-possible-issues" class="anchor" aria-label="Permalink: Possible issues" href="#possible-issues"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <ul dir="auto"> <li><a href="https://niklak.github.io/dom_query_by_example/WASM32-compilation.html" rel="nofollow">wasm32 compilation</a></li> </ul> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Changelog</h2><a id="user-content-changelog" class="anchor" aria-label="Permalink: Changelog" href="#changelog"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <p dir="auto"><a href="/niklak/dom_query/blob/main/CHANGELOG.md">Changelog</a></p> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">License</h2><a id="user-content-license" class="anchor" aria-label="Permalink: License" href="#license"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <p dir="auto">Licensed under MIT (<a href="/niklak/dom_query/blob/main/LICENSE">LICENSE</a> or <a href="http://opensource.org/licenses/MIT" rel="nofollow">http://opensource.org/licenses/MIT</a>)</p> <div class="markdown-heading" dir="auto"><h2 tabindex="-1" class="heading-element" dir="auto">Contribution</h2><a id="user-content-contribution" class="anchor" aria-label="Permalink: Contribution" href="#contribution"><svg class="octicon octicon-link" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path></svg></a></div> <p dir="auto">Any contribution intentionally submitted for inclusion in the work by you, shall be licensed with MIT license, without any additional terms or conditions.</p> </article></div></div></div></div></div> <!-- --> <!-- --> <script type="application/json" id="__PRIMER_DATA_:R0:__">{"resolvedServerColorMode":"day"}</script></div> </react-partial> <input type="hidden" data-csrf="true" value="bsgeBlZFYNmdq/w1OCndyaZUvyk88yL8RAFv0M7uPqB0tWDLoHUPt5RxwkiyC2Mdk0K2wcFWjwNK8lSxY6gFMQ==" /> </div> <div data-view-component="true" class="Layout-sidebar"> <div class="BorderGrid about-margin" data-pjax> <div class="BorderGrid-row"> <div class="BorderGrid-cell"> <div class="hide-sm hide-md"> <h2 class="mb-3 h4">About</h2> <p class="f4 my-3"> A Flexible Rust Crate for DOM Querying and Manipulation </p> <div class="my-3 d-flex flex-items-center"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-link flex-shrink-0 mr-2"> <path d="m7.775 3.275 1.25-1.25a3.5 3.5 0 1 1 4.95 4.95l-2.5 2.5a3.5 3.5 0 0 1-4.95 0 .751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018 1.998 1.998 0 0 0 2.83 0l2.5-2.5a2.002 2.002 0 0 0-2.83-2.83l-1.25 1.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042Zm-4.69 9.64a1.998 1.998 0 0 0 2.83 0l1.25-1.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042l-1.25 1.25a3.5 3.5 0 1 1-4.95-4.95l2.5-2.5a3.5 3.5 0 0 1 4.95 0 .751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018 1.998 1.998 0 0 0-2.83 0l-2.5 2.5a1.998 1.998 0 0 0 0 2.83Z"></path> </svg> <span class="flex-auto min-width-0 css-truncate css-truncate-target width-fit"> <a title="https://docs.rs/dom_query" role="link" target="_blank" rel="noopener noreferrer nofollow" class="text-bold" href="https://docs.rs/dom_query">docs.rs/dom_query</a> </span> </div> <h3 class="sr-only">Topics</h3> <div class="my-3"> <div class="f6"> <a href="/topics/html" title="Topic: html" data-view-component="true" class="topic-tag topic-tag-link"> html </a> <a href="/topics/parser" title="Topic: parser" data-view-component="true" class="topic-tag topic-tag-link"> parser </a> <a href="/topics/scraping" title="Topic: scraping" data-view-component="true" class="topic-tag topic-tag-link"> scraping </a> <a href="/topics/web-scraping" title="Topic: web-scraping" data-view-component="true" class="topic-tag topic-tag-link"> web-scraping </a> <a href="/topics/selectors" title="Topic: selectors" data-view-component="true" class="topic-tag topic-tag-link"> selectors </a> <a href="/topics/css-selectors" title="Topic: css-selectors" data-view-component="true" class="topic-tag topic-tag-link"> css-selectors </a> <a href="/topics/html5ever" title="Topic: html5ever" data-view-component="true" class="topic-tag topic-tag-link"> html5ever </a> </div> </div> <h3 class="sr-only">Resources</h3> <div class="mt-2"> <a class="Link--muted" data-analytics-event="{"category":"Repository Overview","action":"click","label":"location:sidebar;file:readme"}" href="#readme-ov-file"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-book mr-2"> <path d="M0 1.75A.75.75 0 0 1 .75 1h4.253c1.227 0 2.317.59 3 1.501A3.743 3.743 0 0 1 11.006 1h4.245a.75.75 0 0 1 .75.75v10.5a.75.75 0 0 1-.75.75h-4.507a2.25 2.25 0 0 0-1.591.659l-.622.621a.75.75 0 0 1-1.06 0l-.622-.621A2.25 2.25 0 0 0 5.258 13H.75a.75.75 0 0 1-.75-.75Zm7.251 10.324.004-5.073-.002-2.253A2.25 2.25 0 0 0 5.003 2.5H1.5v9h3.757a3.75 3.75 0 0 1 1.994.574ZM8.755 4.75l-.004 7.322a3.752 3.752 0 0 1 1.992-.572H14.5v-9h-3.495a2.25 2.25 0 0 0-2.25 2.25Z"></path> </svg> Readme </a> </div> <h3 class="sr-only">License</h3> <div class="mt-2"> <a href="#MIT-1-ov-file" class="Link--muted" data-analytics-event="{"category":"Repository Overview","action":"click","label":"location:sidebar;file:license"}" > <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-law mr-2"> <path d="M8.75.75V2h.985c.304 0 .603.08.867.231l1.29.736c.038.022.08.033.124.033h2.234a.75.75 0 0 1 0 1.5h-.427l2.111 4.692a.75.75 0 0 1-.154.838l-.53-.53.529.531-.001.002-.002.002-.006.006-.006.005-.01.01-.045.04c-.21.176-.441.327-.686.45C14.556 10.78 13.88 11 13 11a4.498 4.498 0 0 1-2.023-.454 3.544 3.544 0 0 1-.686-.45l-.045-.04-.016-.015-.006-.006-.004-.004v-.001a.75.75 0 0 1-.154-.838L12.178 4.5h-.162c-.305 0-.604-.079-.868-.231l-1.29-.736a.245.245 0 0 0-.124-.033H8.75V13h2.5a.75.75 0 0 1 0 1.5h-6.5a.75.75 0 0 1 0-1.5h2.5V3.5h-.984a.245.245 0 0 0-.124.033l-1.289.737c-.265.15-.564.23-.869.23h-.162l2.112 4.692a.75.75 0 0 1-.154.838l-.53-.53.529.531-.001.002-.002.002-.006.006-.016.015-.045.04c-.21.176-.441.327-.686.45C4.556 10.78 3.88 11 3 11a4.498 4.498 0 0 1-2.023-.454 3.544 3.544 0 0 1-.686-.45l-.045-.04-.016-.015-.006-.006-.004-.004v-.001a.75.75 0 0 1-.154-.838L2.178 4.5H1.75a.75.75 0 0 1 0-1.5h2.234a.249.249 0 0 0 .125-.033l1.288-.737c.265-.15.564-.23.869-.23h.984V.75a.75.75 0 0 1 1.5 0Zm2.945 8.477c.285.135.718.273 1.305.273s1.02-.138 1.305-.273L13 6.327Zm-10 0c.285.135.718.273 1.305.273s1.02-.138 1.305-.273L3 6.327Z"></path> </svg> MIT license </a> </div> <include-fragment src="/niklak/dom_query/hovercards/citation/sidebar_partial?tree_name=main"> </include-fragment> <div class="mt-2"> <a href="/niklak/dom_query/activity" data-view-component="true" class="Link Link--muted"><svg text="gray" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-pulse mr-2"> <path d="M6 2c.306 0 .582.187.696.471L10 10.731l1.304-3.26A.751.751 0 0 1 12 7h3.25a.75.75 0 0 1 0 1.5h-2.742l-1.812 4.528a.751.751 0 0 1-1.392 0L6 4.77 4.696 8.03A.75.75 0 0 1 4 8.5H.75a.75.75 0 0 1 0-1.5h2.742l1.812-4.529A.751.751 0 0 1 6 2Z"></path> </svg> <span class="color-fg-muted">Activity</span></a> </div> <h3 class="sr-only">Stars</h3> <div class="mt-2"> <a href="/niklak/dom_query/stargazers" data-view-component="true" class="Link Link--muted"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-star mr-2"> <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path> </svg> <strong>63</strong> stars</a> </div> <h3 class="sr-only">Watchers</h3> <div class="mt-2"> <a href="/niklak/dom_query/watchers" data-view-component="true" class="Link Link--muted"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-eye mr-2"> <path d="M8 2c1.981 0 3.671.992 4.933 2.078 1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14c-1.981 0-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2ZM1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5c1.473 0 2.825-.742 3.955-1.715 1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5c-1.473 0-2.825.742-3.955 1.715-1.124.967-1.954 2.096-2.366 2.717ZM8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10Z"></path> </svg> <strong>2</strong> watching</a> </div> <h3 class="sr-only">Forks</h3> <div class="mt-2"> <a href="/niklak/dom_query/forks" data-view-component="true" class="Link Link--muted"><svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-repo-forked mr-2"> <path d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z"></path> </svg> <strong>6</strong> forks</a> </div> <div class="mt-2"> <a class="Link--muted" href="/contact/report-content?content_url=https%3A%2F%2Fgithub.com%2Fniklak%2Fdom_query&report=niklak+%28user%29"> Report repository </a> </div> </div> </div> </div> <div class="BorderGrid-row"> <div class="BorderGrid-cell"> <h2 class="h4 mb-3" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame"> <a href="/niklak/dom_query/releases" data-view-component="true" class="Link--primary no-underline Link">Releases <span title="12" data-view-component="true" class="Counter">12</span></a></h2> <a class="Link--primary d-flex no-underline" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" href="/niklak/dom_query/releases/tag/0.16.0"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-tag flex-shrink-0 mt-1 color-fg-success"> <path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"></path> </svg> <div class="ml-2 min-width-0"> <div class="d-flex"> <span class="css-truncate css-truncate-target text-bold mr-2" style="max-width: none;">0.16.0</span> <span title="Label: Latest" data-view-component="true" class="Label Label--success flex-shrink-0"> Latest </span> </div> <div class="text-small color-fg-muted"><relative-time datetime="2025-03-09T10:53:07Z" class="no-wrap">Mar 9, 2025</relative-time></div> </div> </a> <div data-view-component="true" class="mt-3"> <a text="small" data-pjax="#repo-content-pjax-container" data-turbo-frame="repo-content-turbo-frame" href="/niklak/dom_query/releases" data-view-component="true" class="Link">+ 11 releases</a></div> </div> </div> <div class="BorderGrid-row" hidden> <div class="BorderGrid-cell"> <include-fragment src="/niklak/dom_query/used_by_list" accept="text/fragment+html"> </include-fragment> </div> </div> <div class="BorderGrid-row"> <div class="BorderGrid-cell"> <h2 class="h4 mb-3"> <a href="/niklak/dom_query/graphs/contributors" data-view-component="true" class="Link--primary no-underline Link d-flex flex-items-center">Contributors <span title="2" data-view-component="true" class="Counter ml-1">2</span></a></h2> <include-fragment src="/niklak/dom_query/contributors_list?count=2&current_repository=dom_query&items_to_show=2" aria-busy="true" aria-label="Loading contributors"> <ul class="list-style-none "> <li class="mb-2 d-flex"> <div class="Skeleton avatar avatar-user mr-2" style="width:32px;height:32px;"></div> <div class="Skeleton Skeleton--text flex-1 flex-self-center f4"> </div> </li> <li class="mb-2 d-flex"> <div class="Skeleton avatar avatar-user mr-2" style="width:32px;height:32px;"></div> <div class="Skeleton Skeleton--text flex-1 flex-self-center f4"> </div> </li> </ul> </include-fragment> </div> </div> <div class="BorderGrid-row"> <div class="BorderGrid-cell"> <h2 class="h4 mb-3">Languages</h2> <div class="mb-2"> <span data-view-component="true" class="Progress"> <span style="background-color:#dea584 !important;;width: 100.0%;" itemprop="keywords" data-view-component="true" class="Progress-item color-bg-success-emphasis"></span> </span></div> <ul class="list-style-none"> <li class="d-inline"> <a class="d-inline-flex flex-items-center flex-nowrap Link--secondary no-underline text-small mr-3" href="/niklak/dom_query/search?l=rust" data-ga-click="Repository, language stats search click, location:repo overview"> <svg style="color:#dea584;" aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-dot-fill mr-2"> <path d="M8 4a4 4 0 1 1 0 8 4 4 0 0 1 0-8Z"></path> </svg> <span class="color-fg-default text-bold mr-1">Rust</span> <span>100.0%</span> </a> </li> </ul> </div> </div> </div> </div> </div></div> </div> </div> </turbo-frame> </main> </div> </div> <footer class="footer pt-8 pb-6 f6 color-fg-muted p-responsive" role="contentinfo" > <h2 class='sr-only'>Footer</h2> <div class="d-flex flex-justify-center flex-items-center flex-column-reverse flex-lg-row flex-wrap flex-lg-nowrap"> <div class="d-flex flex-items-center flex-shrink-0 mx-2"> <a aria-label="Homepage" title="GitHub" class="footer-octicon mr-2" href="https://github.com"> <svg aria-hidden="true" height="24" viewBox="0 0 24 24" version="1.1" width="24" data-view-component="true" class="octicon octicon-mark-github"> <path d="M12 1C5.9225 1 1 5.9225 1 12C1 16.8675 4.14875 20.9787 8.52125 22.4362C9.07125 22.5325 9.2775 22.2025 9.2775 21.9137C9.2775 21.6525 9.26375 20.7862 9.26375 19.865C6.5 20.3737 5.785 19.1912 5.565 18.5725C5.44125 18.2562 4.905 17.28 4.4375 17.0187C4.0525 16.8125 3.5025 16.3037 4.42375 16.29C5.29 16.2762 5.90875 17.0875 6.115 17.4175C7.105 19.0812 8.68625 18.6137 9.31875 18.325C9.415 17.61 9.70375 17.1287 10.02 16.8537C7.5725 16.5787 5.015 15.63 5.015 11.4225C5.015 10.2262 5.44125 9.23625 6.1425 8.46625C6.0325 8.19125 5.6475 7.06375 6.2525 5.55125C6.2525 5.55125 7.17375 5.2625 9.2775 6.67875C10.1575 6.43125 11.0925 6.3075 12.0275 6.3075C12.9625 6.3075 13.8975 6.43125 14.7775 6.67875C16.8813 5.24875 17.8025 5.55125 17.8025 5.55125C18.4075 7.06375 18.0225 8.19125 17.9125 8.46625C18.6138 9.23625 19.04 10.2125 19.04 11.4225C19.04 15.6437 16.4688 16.5787 14.0213 16.8537C14.42 17.1975 14.7638 17.8575 14.7638 18.8887C14.7638 20.36 14.75 21.5425 14.75 21.9137C14.75 22.2025 14.9563 22.5462 15.5063 22.4362C19.8513 20.9787 23 16.8537 23 12C23 5.9225 18.0775 1 12 1Z"></path> </svg> </a> <span> © 2025 GitHub, Inc. </span> </div> <nav aria-label="Footer"> <h3 class="sr-only" id="sr-footer-heading">Footer navigation</h3> <ul class="list-style-none d-flex flex-justify-center flex-wrap mb-2 mb-lg-0" aria-labelledby="sr-footer-heading"> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to Terms","label":"text:terms"}" href="https://docs.github.com/site-policy/github-terms/github-terms-of-service" data-view-component="true" class="Link--secondary Link">Terms</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to privacy","label":"text:privacy"}" href="https://docs.github.com/site-policy/privacy-policies/github-privacy-statement" data-view-component="true" class="Link--secondary Link">Privacy</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to security","label":"text:security"}" href="https://github.com/security" data-view-component="true" class="Link--secondary Link">Security</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to status","label":"text:status"}" href="https://www.githubstatus.com/" data-view-component="true" class="Link--secondary Link">Status</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to docs","label":"text:docs"}" href="https://docs.github.com/" data-view-component="true" class="Link--secondary Link">Docs</a> </li> <li class="mx-2"> <a data-analytics-event="{"category":"Footer","action":"go to contact","label":"text:contact"}" href="https://support.github.com?tags=dotcom-footer" data-view-component="true" class="Link--secondary Link">Contact</a> </li> <li class="mx-2" > <cookie-consent-link> <button type="button" class="Link--secondary underline-on-hover border-0 p-0 color-bg-transparent" data-action="click:cookie-consent-link#showConsentManagement" data-analytics-event="{"location":"footer","action":"cookies","context":"subfooter","tag":"link","label":"cookies_link_subfooter_footer"}" > Manage cookies </button> </cookie-consent-link> </li> <li class="mx-2"> <cookie-consent-link> <button type="button" class="Link--secondary underline-on-hover border-0 p-0 color-bg-transparent" data-action="click:cookie-consent-link#showConsentManagement" data-analytics-event="{"location":"footer","action":"dont_share_info","context":"subfooter","tag":"link","label":"dont_share_info_link_subfooter_footer"}" > Do not share my personal information </button> </cookie-consent-link> </li> </ul> </nav> </div> </footer> <ghcc-consent id="ghcc" class="position-fixed bottom-0 left-0" style="z-index: 999999" data-initial-cookie-consent-allowed="" data-cookie-consent-required="false"></ghcc-consent> <div id="ajax-error-message" class="ajax-error-message flash flash-error" hidden> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-alert"> <path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path> </svg> <button type="button" class="flash-close js-ajax-error-dismiss" aria-label="Dismiss error"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> You can’t perform that action at this time. </div> <template id="site-details-dialog"> <details class="details-reset details-overlay details-overlay-dark lh-default color-fg-default hx_rsm" open> <summary role="button" aria-label="Close dialog"></summary> <details-dialog class="Box Box--overlay d-flex flex-column anim-fade-in fast hx_rsm-dialog hx_rsm-modal"> <button class="Box-btn-octicon m-0 btn-octicon position-absolute right-0 top-0" type="button" aria-label="Close dialog" data-close-dialog> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-x"> <path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"></path> </svg> </button> <div class="octocat-spinner my-6 js-details-dialog-spinner"></div> </details-dialog> </details> </template> <div class="Popover js-hovercard-content position-absolute" style="display: none; outline: none;"> <div class="Popover-message Popover-message--bottom-left Popover-message--large Box color-shadow-large" style="width:360px;"> </div> </div> <template id="snippet-clipboard-copy-button"> <div class="zeroclipboard-container position-absolute right-0 top-0"> <clipboard-copy aria-label="Copy" class="ClipboardButton btn js-clipboard-copy m-2 p-0" data-copy-feedback="Copied!" data-tooltip-direction="w"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon m-2"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check js-clipboard-check-icon color-fg-success d-none m-2"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> </div> </template> <template id="snippet-clipboard-copy-button-unpositioned"> <div class="zeroclipboard-container"> <clipboard-copy aria-label="Copy" class="ClipboardButton btn btn-invisible js-clipboard-copy m-2 p-0 d-flex flex-justify-center flex-items-center" data-copy-feedback="Copied!" data-tooltip-direction="w"> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-copy js-clipboard-copy-icon"> <path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"></path><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"></path> </svg> <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-check js-clipboard-check-icon color-fg-success d-none"> <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"></path> </svg> </clipboard-copy> </div> </template> </div> <div id="js-global-screen-reader-notice" class="sr-only mt-n1" aria-live="polite" aria-atomic="true" ></div> <div id="js-global-screen-reader-notice-assertive" class="sr-only mt-n1" aria-live="assertive" aria-atomic="true"></div> </body> </html>