mit javascript per DOM color abfragen – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self mit javascript per DOM color abfragen Sat, 03 Jul 21 20:02:52 Z https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789893#m1789893 https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789893#m1789893 <p>Hallo,</p> <p>ist es möglich per DOM die Farbe eines Elements abzufragen, z.B. alert(document.getElementById("Tabellenname>").rows[i].cells[0].firstChild.style.color) ?</p> <p>Gruss, wonk</p> mit javascript per DOM color abfragen Sat, 03 Jul 21 20:12:32 Z https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789894#m1789894 https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789894#m1789894 <p>Hallo wonk,</p> <p>wenn das auf diese Weise identifizierte firstChild-Element ein style-Attribut hat, in dem die color-Eigenschaft gesetzt wird, dann ja.</p> <p>Aber das wird in den meisten Fällen nicht der Fall sein. Wenn die Farbe per Stylesheet bestimmt wird, oder sich einfach dorthin vererbt, musst Du zuerst die gesammelten Werke aller gültigen Styles integrieren. Die dafür erforderliche Raketenwissenschaft bringt das window Objekt glücklicherweise schon mit.</p> <pre><code class="block language-js"><span class="token keyword">let</span> aktuellerStyle <span class="token operator">=</span> window<span class="token punctuation">.</span><span class="token function">getComputedStyle</span><span class="token punctuation">(</span> document<span class="token punctuation">.</span><span class="token function">getElementById</span><span class="token punctuation">(</span><span class="token string">"Tabellenname"</span><span class="token punctuation">)</span><span class="token punctuation">.</span>rows<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">.</span>cells<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">.</span>firstChild <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">alert</span><span class="token punctuation">(</span>aktuellerStyle<span class="token punctuation">.</span>color<span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> mit javascript per DOM color abfragen Sun, 04 Jul 21 19:43:17 Z https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789931#m1789931 https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789931#m1789931 <p>Hallo,</p> <p>das klappt und liefert die Farbe z.B. in der Form rgb(0,0,0). Ich will aber die Farbe vergleichen z.B. in der Form</p> <pre><code class="block">if (aktuellerStyle.color == rgb(0,0,0) { ... </code></pre> <p>So funktioniert das aber nicht. Muss ich da zum Vergleich erst ein passendes Style oder Color-Objekt erzeugen?</p> <p>Gruss, wonk</p> mit javascript per DOM color abfragen Sun, 04 Jul 21 20:46:37 Z https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789932#m1789932 https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789932#m1789932 <p>Hallo wonk,</p> <blockquote> <p>So funktioniert das aber nicht.</p> </blockquote> <p>Ach sorry, ich muss den Selfer raushängen lassen.</p> <p>„Funktioniert nicht“ funktioniert nicht als Problembeschreibung.</p> <p>Was hast Du getan, um dem Fehler auf die Spur zu kommen? Welche Debugging-Schritte hast Du unternommen?</p> <p>Was erscheint in der Konsole der Entwicklerwerkzeuge, wenn Du dein Script ausführst?<br> Was <strong>genau</strong> steht in <code>aktuellerStyle.color</code> drin?<br> Was ist dieses rgb(0,0,0), das Du darin findest? Eine Zahl? Ein Objekt? Was anderes?<br> Was ist dieses rgb(0,0,0), das in deinem IF steht? Eine Zahl? Eine Zeichenkette? Was anderes?</p> <p>Warum stelle ich Fragen, statt zu sagen: „Muttu so und so machen, dann fluppt dat“? Weil Abschreiben und Zusammenkopieren von Fertigcode keinen Lerneffekt hat.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> mit javascript per DOM color abfragen Mon, 05 Jul 21 08:58:08 Z https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789936#m1789936 https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789936#m1789936 <p>Hallo,</p> <p>ich will es ja eigentlich auch verstehen, bin aber kein javascipt-Fachmann, insbesondere nicht im DOM-Bereich.</p> <p>Ich habe es jetzt aber herausbekommen. "rgb(0, 0, 0)" (für Farbe schwarz) ist vom Typ String. Die Abfrage muss also lauten:</p> <p>if (aktuellerStyle.color == "rgb(0, 0, 0)" { ...</p> <p>Allerdings hatte ich zunächst übersehen, dass hinter den Kommata in der Farbbezeichnung jeweils ein Leerzeichen ist, was für einen Stringvergleich natürlich wesentlich ist.</p> <p>Gruss, wonk</p> mit javascript per DOM color abfragen Mon, 05 Jul 21 09:23:55 Z https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789937#m1789937 https://forum.selfhtml.org/self/2021/jul/03/mit-javascript-per-dom-color-abfragen/1789937#m1789937 <p>Hallo wonk,</p> <p>sehr gut </p> <p>Ich habe keine Ahnung, ob die Schreibweise dieses Ergebnisses in allen Browsern gleich ist. In Chrome, Firefox und Internet Explorer ist es gleich, aber es gibt ja noch eine Menge mehr.</p> <p>Beachte auch, dass Du nicht rgb(r, g, b), sondern rgba(r, g, b, a) zurückbekommst, wenn die Farbe Transparenz enthält.</p> <p>Bei <a href="https://stackoverflow.com/questions/67005331/is-color-format-specified-in-the-spec-for-getcomputedstyle" rel="noopener noreferrer">Stackoverflow</a> hat jemand nachgefragt, ob denn eine Rückgabe als CSS Funktion rbg oder rgba irgendwo als Spezifizikation festgeschrieben sei. Antwort war: Im Prinzip schon (mit Links auf die konkrete Spec), aber die CSS Color 4 Spec definiert neue Arten, Farben anzugeben und da mag es anders werden. Aber das ist was für die Zukunft und vor allem dürfte das nur passieren, wenn Du die Neuerungen auch bei Dir anwendest.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div>