zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden Eltern-Element ausblenden

Antwort
 
LinkBack Themen-Optionen Ansicht
  #21 (permalink)  
Alt 22.10.2018, 08:30
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.004
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Zitat:
Zitat von AndreasB Beitrag anzeigen
Wie in der Ausgangsfrage geschildert geht es mir um das Nachbilden eines nicht existierenden CSS-Selektors.

Angenommen es gäbe Vorfahrenselektoren, nehmen wir das Symbol Δ, dann wäre das so ein - fiktiver - CSS-Selektor:


Vielleicht liegen die Gründe auch in den programmiertechnischen Schwierigkeiten, sonst gäbe es vielleicht längst in CSS einen Vorfahren-Selektor.
Es gibt diesen Selektor schon in der neuen CSS Spezifikation (als Entwurf), er ist nur noch in keinem Browser implementiert.
Er lautet :has() und lautet zb so: a:has(img), spricht alle a Tags an die ein Bild enthalten.

Warum es den Selektor bis jetzt nicht gibt ist performance: https://snook.ca/archives/html_and_c...rent-selectors

Zitat:
Zitat von AndreasB Beitrag anzeigen
https://codepen.io/fermion/pen/JmZNPw

Das funktioniert, da werden alle Container ausgeblendet.

Würdest Du diesen Code als am stabilsten für den beschriebenen Zweck (Nachbilden eines Vorfahren-Selektors) empfehlen?

Es funktioniert, also ist es stabil genug. Mehr Anforderungen an einen 3-Zeiler gibt es nicht. Man kann lediglich das DRY Prinzip noch anpassen und Codezeilen zusammenfassen
Code:
element=document.querySelectorAll('.kind');
element.forEach((i) => {
i=i.parentNode.parentNode.parentNode;
i.style.display='none';
});
Zitat:
Zitat von AndreasB Beitrag anzeigen
Die semantische Qualität des HTML SPON ist leider immer noch unterirdisch schlecht.
Denn ansonsten gäbe es weder DIV-Suppen bei SPON, keinen kilometerlangen redundanten Code und natürlich hätte jeder Vorschau-Container zu Spiegelplus das Klassenattribut "ssplus" und solche Hacks wie wir sie gerade versuchen zu entwickeln wären völlig überflüssig.

Ich reibe mir bei der absolut grottigen Qualität des Codes des SPON-CMS immer wieder verwundert die Augen.
Wer verantwortet bloß so einen Mist.
Miserabel wartbar.
Ich glaube du hast eine falsche Vorstellung was eine div Suppe ist. divs sind nichts böses und schlechtes und spiegel hat auch keine div Suppe.
Welchen "redundanten Code" meinst du? Artikel wiederholen sich und demzufolge auch das HTML..?
Mein Punkt ist aber folgender: Grottenschlecht ist der Code nicht, verbessern kann man an jedem Code etwas, das hat dieser Beruf an sich. Es gibt nie die eine, richtige Lösung.
div Suppe ist das keine, es werden überall die semantisch korrekten Elemente verwendet.
Du hast Recht, das hat jetzt nichts mit deinem ursprünglichen Thema zu tun, aber solche unqualifizierten Falschaussagen kann ich nicht hier stehen lassen.
Und nein, weder lese ich spiegel noch arbeite ich dafür.
Mit Zitat antworten
Sponsored Links
  #22 (permalink)  
Alt 22.10.2018, 10:40
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

@cloned
Danke für den Hinweis zu dem Selektor ":has", der als Entwurf vorliegt, das war mir entgangen.
Danke auch nochmal für Deine und Bastians Hilfe für den Code.
Die noch ausstehende Aufgabe, das Ding in Greasemonkey zum Laufen zu bringen, löse ich bestimmt noch.

Zur Qualität des HTML von spiegel.de:
Jede andere Aussage von Dir hätte ich mich gewundert
Wir haben zu manchen Dingen offenbar fundamental verschiedene Auffassungen.
Es erstaunt mich, dass Du diesen Code "verteidigst". Ich könnte Dir zig konkrete Beispiele nennen, warum genau ich den Code als schlecht bezeichne.
Aber das würde zu nichts führen. Und hier wäre es offtopic.
Eine sinnvolle Diskussion müsste sowieso erst klären, welche abstrakten Merkmale wir beide für Hochwertigkeit heranziehen.
Schon dabei lägen wir vermutlich völlig auseinander.
__________________

Mit Zitat antworten
Sponsored Links
  #23 (permalink)  
Alt 22.10.2018, 11:40
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.004
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Zitat:
Zitat von AndreasB Beitrag anzeigen
Zur Qualität des HTML von spiegel.de:
Jede andere Aussage von Dir hätte ich mich gewundert
Wir haben zu manchen Dingen offenbar fundamental verschiedene Auffassungen.
Es erstaunt mich, dass Du diesen Code "verteidigst". Ich könnte Dir zig konkrete Beispiele nennen, warum genau ich den Code als schlecht bezeichne.
Aber das würde zu nichts führen. Und hier wäre es offtopic.
Eine sinnvolle Diskussion müsste sowieso erst klären, welche abstrakten Merkmale wir beide für Hochwertigkeit heranziehen.
Schon dabei lägen wir vermutlich völlig auseinander.
Das stimmt, das ist hier offtopic. Ich verteidie den Code weniger als ich deine Falschaussage, dass es sich um eine div suppe handelt, richtig stelle. Darum ging es mir. Nicht um "hochwertigkeit". Das habe ich lediglich in einem Nebensatz angesprohen.
Also nochmal für alle, die mitlesen: Der code von Spiegel ist keine div suppe sondern lediglich der zu erwartende outcome wenn man an so einem großen Projekt (inklusive Datenbankanbindung) arbeitet.
Mit Zitat antworten
  #24 (permalink)  
Alt 22.10.2018, 12:15
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

Ich widerspreche Deiner Aussage, dass es sich um keine DIV-Suppe handelt.

Es werden sowohl vermeidbare DIVs ausgegeben als auch DIVs verwendet, wo Elemente "mit Semantik" existieren. Dito für SPANs.


Ich widerspreche auch Deiner Aussage, dass ein großes CMS mit angebundener Datenbank zwingend solchen minderwertigen und extrem länglichen Code ausgeben muss.
Es ginge viel prägnanter, wenn denn die CMS-Verantwortlichen Interesse an der Ausgabe von modernem und prägnantem HTML hätten.
Gerade bei einem so großen Anbieter, der viele Fachkräfte allein für die Webtechnik beschäftigt, wo also ein riesiges Budget existiert, ist das ein Armutszeugnis.


Allein die vielen Attribute und Werte, die mühelos durch elegante CSS-Selektoren überflüssig würden, zeigen, wie wenig Lust die Verantwortlichen haben, modernen Code auszugeben.

Solltest Du das doch diskutieren wollen, können wir dazu einen neuen Thread aufmachen.
__________________


Geändert von AndreasB (22.10.2018 um 12:32 Uhr)
Mit Zitat antworten
  #25 (permalink)  
Alt 22.10.2018, 13:08
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.004
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Zitat:
Zitat von AndreasB Beitrag anzeigen
Solltest Du das doch diskutieren wollen, können wir dazu einen neuen Thread aufmachen.
Von mir aus gerne, sofern ich Zeit dafür habe beteilige ich mich daran.
Eine Frage nur:

Zitat:
Zitat von AndreasB Beitrag anzeigen
Es werden sowohl vermeidbare DIVs ausgegeben als auch DIVs verwendet, wo Elemente "mit Semantik" existieren. Dito für SPANs.
Wo? Hast du ein konkretes Beispiel dafür?
Mit Zitat antworten
  #26 (permalink)  
Alt 22.10.2018, 14:28
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

Ich habe zum Thema "Kritik der Qualität des HTML-Codes von spiegel.de" einen neuen Thread eröffnet.


https://xhtmlforum.de/73659-kritik-d...ost553081.html
__________________

Mit Zitat antworten
  #27 (permalink)  
Alt 24.10.2018, 18:00
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

@basti


Ich ziehe mal Dein Greasemonkeyskript aus dem anderen Thread hierher, weil es hier ontopic ist:


Code:
// ==UserScript== // @name         Spiegel+ ausblenden // @author       Andreas // @include      *spiegel.de* // @noframes // @grant  GM_getValue // @grant  GM_setValue // @grant  GM_addStyle // @grant  GM_xmlhttpRequest // @version       2.0 // @require https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js // ==/UserScript==  console.log('Script is running')  $(document).ready(function(){   console.log('ready have fired');  //ele=document.getElementsByClassName('spplus')[1];  element=document.querySelectorAll('.spplus'); element.forEach((i) => { i=i.parentNode; i=i.parentNode; i=i.parentNode; inp=i.outerHTML; inp=inp.indexOf('class="teaser'); if(inp!=-1){  console.log('kill');   i.style.display='none'; }else{   console.log('no kill'); } }); });
Ganz herzlichen Dank.
Es funktioniert.


Sieht ziemlich kompliziert aus.


ist der Code, wo das Class-Attribut "teaser" angegeben wird, zwingend nötig?


Ich habe durch Ausprobieren diverse Zeilen entfernt, es funktioniert immer noch:


Code:
// ==UserScript==
// @name         Spiegel: Vorfahren ausblenden
// @author       Andreas
// @include      *spiegel.de*
// ==/UserScript==

//Spiegel Plus
element=document.querySelectorAll('.spplus');
element.forEach((i) => {
i=i.parentNode;
i=i.parentNode;
i=i.parentNode;
i.style.display='none';
});

//Fußball
element=document.querySelectorAll('[href*="/sport/fussball/"]');
element.forEach((i) => {
i=i.parentNode;
i=i.parentNode;
i=i.parentNode;
i.style.display='none';
});

Das ist wirklich richtig geil.
Endlich kann ich auch Elemente rauskicken, die sich per CSS nicht treffen lassen.




Ich suche ja nach einer möglichst universellen Lösung (auch nicht nur für spiegel.de) für Userscripts in Firefox, wo ich entweder ein oder mehrere Eltern angeben kann:


Darf ich bitte noch etwas zum Pseudo-Klasse "has" stellen?


Auf https://developer.mozilla.org/en-US/docs/Web/CSS/:has steht:


Zitat:
The :has() pseudo-class takes a selector list as an argument. In the current specification :has is not marked as part of the live selector profile, which means it can not be used within stylesheets; only with functions like document.querySelector().
Bedeutet dies, dass man es in einem Userscript (in Greasemonkey) einsetzen könnte?
__________________


Geändert von AndreasB (24.10.2018 um 23:32 Uhr)
Mit Zitat antworten
  #28 (permalink)  
Alt 25.10.2018, 12:17
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 23.01.2018
Beiträge: 145
basti1012 befindet sich auf einem aufstrebenden Ast
Standard

Bei meinen Script konnte sicher noch was raus. Zb mitclass teaser habe ich nur gemacht weil es auch ein Eltern gab was <ul> hatte , irgendwo anders auf der Seite. Dann hätte er auch was anderes geblockt was vieleicht gar nicht geblockt werden sollte.Deswegen habe ich mich nur an denn Quellcode gehalten den du mal hier irgendwo gepostet hattest.wenn deine änderungen jetzt alles das blocken wie du es ja haben willst ist doch gut.
Ich hatte gestern auch keine große lust mehr auf Spiegel.de weiter rum zu spielen weil hatte da nur probleme auf der Seite. Aber das wäre jetzt hier wieder offtopic

wegen dein has() mußt du mal an besten testen. has() gibt es ja schon länger in Js aber halt im Css noch nicht. denke das es bei Greasmonkey eigentlich gehen müßte. Aber ohne testen kann ich das auch nur vermuten, weil Greasmonkey hat sowieso sein eigenleben schlimmer als tampermonkey finde ich
Mit Zitat antworten
  #29 (permalink)  
Alt 25.10.2018, 13:11
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

Wie müssten denn bitte - unabhängig von Greasemonkey - der komplette Code für die Anwendung von "has" lauten?
Am besten mit dem Beispiel ".ssplus" und drei Eltern.


Ich verstehe leider anhand developer.mozilla.org nicht, wie der Code lauten müsste.


Am coolsten wäre übrigens ein Skript, welches die Verwendung von typischer CSS-Syntax erlaubt.
Aber das ist vermutlich mit JS nicht hinzukriegen.

.ssplus < * < * < *

"<" sei der fiktive Eltern-Selektor

.ssplus _ .teaser

"_" sei der fiktive Vorfahren-Selektor.
__________________


Geändert von AndreasB (25.10.2018 um 13:32 Uhr)
Mit Zitat antworten
Sponsored Links
  #30 (permalink)  
Alt 25.10.2018, 14:03
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.004
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Hier siehst du, welche Browser bereits :has unterstützen:

https://developer.mozilla.org/en-US/..._compatibility

und

https://caniuse.com/#feat=css-has

Wie man hier gut sehen kann ist diese Funktionalität noch nicht implementiert, demzufolge kannst du sie noch nicht verwenden.

Greasemonkey verwendet auch "nur" JS, kann also auch nur die Funktionen der Browser verwenden.
Beispiel wäre also zB div:has(> * > * .ssplus)

Eine Anmerkung zu dem Skript von basti noch anstatt mittels outerhtml die Klasse abzufragen würde ich nativ classlist von JS empfehlen

Auch habe ich bereits angemerkt dass .parentNode auch hintereinander angewandt werden kann und nicht jedesmal einer neuen (derselben) Variable zugewiesen werden muss.

Edit: Danke auch Andreas für den Hinweis dass :has dann nur in JS funktionieren wird, das hätte ich sonst wahrscheinlich übersehen wenn es denn einmal benutzbar wird.
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
jQuery: Element beim Scrollen ausblenden DavidNF Javascript & Ajax 2 21.09.2011 09:48
Element ausblenden, wenn anderes eingeblendet wird vik.alive Javascript & Ajax 13 11.05.2009 13:16
Liste im IE StarSt0rm CSS 3 22.08.2007 20:04
element ausblenden, aber klickbar belassen antiheld2000 CSS 4 07.05.2007 16:22
Element mit Javascript ein- und ausblenden yellowfox Javascript & Ajax 1 17.08.2006 16:05


Alle Zeitangaben in WEZ +2. Es ist jetzt 16:35 Uhr.