{"id":1166,"date":"2016-08-23T09:17:53","date_gmt":"2016-08-23T07:17:53","guid":{"rendered":"https:\/\/launix.de\/launix\/?p=1166"},"modified":"2016-08-26T16:39:27","modified_gmt":"2016-08-26T14:39:27","slug":"browser-bedienung-automatisieren","status":"publish","type":"post","link":"https:\/\/launix.de\/launix\/browser-bedienung-automatisieren\/","title":{"rendered":"Browser-Bedienung automatisieren"},"content":{"rendered":"<p>Manchmal will man l\u00e4stige Klick-Arbeiten im Browser einfach automatisieren. Wie das geht, lernt ihr in diesem Tutorial.<!--more--><\/p>\n<p>https:\/\/youtu.be\/Xv9rokKD6_U<\/p>\n<h2>Schritt 1: Website analysieren<\/h2>\n<p>Beim Automatisieren geht es meist darum, Text in bestimmte Felder einzutragen oder bestimmte Buttons zu klicken. Diese Eingabefelder m\u00fcssen lokalisiert werden, um sp\u00e4ter dem Browser mitzuteilen, in <i>welche<\/i> Eingabefelder etwas eingetragen werden soll. Mit einem Rechtsklick auf das Element und ein Klick auf &#8220;Element untersuchen&#8221; im Kontextmen\u00fc, blendet die HTML-Ansicht unten im Browser ein und hebt das aktuelle Element hervor. Die einzelnen Elemente lokalisiert man jetzt folgenderma\u00dfen:<\/p>\n<ul>\n<li>Ist ein Attribut <code>id=\"irgendwas\"<\/code> vorhanden, lokalisiert man das Element mit <code>#irgendwas<\/code><\/li>\n<li>Ist ein Attribut <code>name=\"irgendwas\"<\/code> vorhanden, lokalisiert man das Element mit <code>[name=\"irgendwas\"]<\/code><\/li>\n<li>Gibt es weder <i>id<\/i> noch <i>name<\/i> bleibt nur der Gang \u00fcber die Umgebung des Elements: Dazu dienen alle Anhaltspunkte, die dazu geeignet sind, das Element eindeutig zu identifizieren, insbesondere umgebende Klassen und die Klassen des Elements. Beispiel: Wir wollen das Input-Feld in der p-Umgebung identifizieren <code>&lt;p class=\"input-name\"&gt;&lt;input&gt;&lt;\/p&gt;<\/code> wird beispielsweise mit <code>p.input-name input<\/code> lokalisiert<\/li>\n<li>Eine genaue Dokumentation aller Selektoren, um Elemente zu lokalisieren, bietet das W3C unter <a href=\"http:\/\/www.w3schools.com\/jquery\/jquery_ref_selectors.asp\" target=\"_blank\">diesem Link<\/a><\/li>\n<\/ul>\n<h2>Schritt 2: Sichergehen, dass jQuery vorhanden ist<\/h2>\n<p>Ist man in der Element-Untersuchen-Ansicht, gibt es unten eine Textzeile, die meist mit einem &gt;&gt; beginnt. Dort gibt man JavaScript-Befehle ein. Nun muss noch die jQuery-Bibliothek geladen sein. Das \u00fcberpr\u00fcft man, indem man dort ein &#8220;$&#8221; eingibt und ENTER dr\u00fcckt. Kommt als Antwort ein &#8220;function()&#8221;, ist jQuery ordentlich geladen. Kommt stattdessen ein &#8220;undefined&#8221;, m\u00fcssen wir es noch laden. Das geht, indem folgendes Kommando eingibt und ENTER dr\u00fcckt: &#8220;<code>script = document.createElement('script'); script.src = 'https:\/\/code.jquery.com\/jquery-latest.min.js'; document.body.appendChild(script);<\/code>&#8220;. Anschlie\u00dfend sollte die Eingabe von &#8220;$&#8221; ein &#8220;function()&#8221; zur\u00fcckgeben.<\/p>\n<h2>Schritt 3: Eingabefelder automatisch ausf\u00fcllen<\/h2>\n<p>Aus Schritt 1 haben wir uns die Selektoren f\u00fcr die Eingabefelder herausgesucht. Diese verwenden wir jetzt in einem Kommando: <code>$('hier Selektor eintragen').val('hier Wert eintragen');<\/code><\/p>\n<p>Beispiel: <code>$('#url').val('http:\/\/launix.de');<\/code><\/p>\n<p>Sind bei den Werten nicht nur feste Texte gew\u00fcnscht, sondern beispielsweise der Vor- und Nachname des Xing-Kontakts, f\u00fcr den Sie die Kontakt-Anfrage senden, arbeiten Sie sich einfach etwas tiefer in JavaScript und jQuery hinein. Es geht im Prinzip ganz einfach, hat man erst die Grundmechanismen verstanden.<\/p>\n<h2>Schritt 4: den Klick ausl\u00f6sen<\/h2>\n<p>Aus Schritt 1 haben wir den Selektor f\u00fcr den Submit-Button herausgesucht. F\u00fcr diesen l\u00f6sen wir jetzt noch den Klick aus: <code>$('hier Selektor eintragen').click();<\/code><\/p>\n<p>Beispiel: <code>$('input[type=\"submit\"]').click();<\/code><\/p>\n<h2>Fazit<\/h2>\n<p>Ich habe bereits Stunden an Arbeit gespart bzw. konnte tausende Dinge mehr erledigen, als wenn ich alles von Hand gemacht h\u00e4tte.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Manchmal will man l\u00e4stige Klick-Arbeiten im Browser einfach automatisieren. Wie das geht, lernt ihr in diesem Tutorial.<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_editorskit_title_hidden":false,"_editorskit_reading_time":0,"_editorskit_is_block_options_detached":false,"_editorskit_block_options_position":"{}","_uag_custom_page_level_css":"","footnotes":""},"categories":[1],"tags":[74],"class_list":["post-1166","post","type-post","status-publish","format-standard","hentry","category-allgemein","tag-programmieren-fuer-berufstaetige","single-item"],"featured_image_urls_v2":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","1536x1536":"","2048x2048":"","trp-custom-language-flag":"","xs-thumb":"","appku-shop-single":""},"post_excerpt_stackable_v2":"<p>Manchmal will man l\u00e4stige Klick-Arbeiten im Browser einfach automatisieren. Wie das geht, lernt ihr in diesem Tutorial. https:\/\/youtu.be\/Xv9rokKD6_U Schritt 1: Website analysieren Beim Automatisieren geht es meist darum, Text in bestimmte Felder einzutragen oder bestimmte Buttons zu klicken. Diese Eingabefelder m\u00fcssen lokalisiert werden, um sp\u00e4ter dem Browser mitzuteilen, in welche Eingabefelder etwas eingetragen werden soll. Mit einem Rechtsklick auf das Element und ein Klick auf &#8220;Element untersuchen&#8221; im Kontextmen\u00fc, blendet die HTML-Ansicht unten im Browser ein und hebt das aktuelle Element hervor. Die einzelnen Elemente lokalisiert man jetzt folgenderma\u00dfen: Ist ein Attribut id=&#8221;irgendwas&#8221; vorhanden, lokalisiert man das Element mit #irgendwas&hellip;<\/p>\n","category_list_v2":"<a href=\"https:\/\/launix.de\/launix\/category\/allgemein\/\" rel=\"category tag\">Allgemein<\/a>","author_info_v2":{"name":"Carl-Philip H\u00e4nsch","url":"https:\/\/launix.de\/launix\/author\/carli\/"},"comments_num_v2":"0 comments","uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false,"xs-thumb":false,"appku-shop-single":false},"uagb_author_info":{"display_name":"Carl-Philip H\u00e4nsch","author_link":"https:\/\/launix.de\/launix\/author\/carli\/"},"uagb_comment_info":0,"uagb_excerpt":"Manchmal will man l\u00e4stige Klick-Arbeiten im Browser einfach automatisieren. Wie das geht, lernt ihr in diesem Tutorial.","_links":{"self":[{"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/posts\/1166","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/comments?post=1166"}],"version-history":[{"count":4,"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/posts\/1166\/revisions"}],"predecessor-version":[{"id":1185,"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/posts\/1166\/revisions\/1185"}],"wp:attachment":[{"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/media?parent=1166"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/categories?post=1166"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/launix.de\/launix\/wp-json\/wp\/v2\/tags?post=1166"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}