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
  #1 (permalink)  
Alt 18.10.2018, 10:10
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 Eltern-Element ausblenden

In CSS existiert kein Selektor, der ein Matchen eines Elternelementes erlaubt.


Ich möchte gerne auf einer häufig genutzten Nachrichtenseite bestimmte Artikelvorschauen, die zu Artikeln hinter einer Paywal führen, ausblenden.


Testcase:

HTML-Code:
<div><div><h2><a class="spplus" ...>...</a></h2></div></div>

Das äußere DIV soll ausgeblendet werden.


Kennt jemand für diesen Standardfall ein funktionierendes Javascript?


Ich würde mich über einen Hinweis freuen. Danke!



Wie wendet ihr Userscripts für spezifische Websites in Firefox an? Greasemonkey?
__________________

Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 18.10.2018, 10:42
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.995
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

woran genau bist du gescheitert?

el = document.getElementsByClassName('ssplus') zum selektieren der Elemente.

el = el.closest('div') um das div zu selektieren.

el.style.display = 'none' um es auszublenden.

edit: da wirst du noch über das array vom getElementsByClassName iterieren müssen um Schritt 2 und 3 für jedes Element auszuführen.

Bzw. mit einem foreach() von es5, bzw. for of von es6 müsste es noch simpler gehen.
https://hacks.mozilla.org/2015/04/es...e-for-of-loop/

Geändert von cloned (18.10.2018 um 10:57 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 18.10.2018, 11:26
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

Danke für Deine Antwort.


Ich bat ja um ein funktionierendes komplettes Skript. Wie Du weißt, beherrsche ich Javascript nicht. Daher ist es zu kompliziert für mich, selber aus Bausteinen ein Script zu verfassen.

Wenn hier niemand mitliest, der so ein Script posten möchte: kein Problem
War ja nur eine Bitte, keine Erwartung.
__________________

Mit Zitat antworten
  #4 (permalink)  
Alt 18.10.2018, 17:21
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 23.01.2018
Beiträge: 145
basti1012 befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von AndreasB Beitrag anzeigen
In CSS existiert kein Selektor, der ein Matchen eines Elternelementes erlaubt.


Ich möchte gerne auf einer häufig genutzten Nachrichtenseite bestimmte Artikelvorschauen, die zu Artikeln hinter einer Paywal führen, ausblenden.
wenn du ein nur ein Elternelement ausblenden willst sollte das doch reichen

Code:
<div id="blendmichaus"><span id="kind">hallo</span></div>
<script>
 ele=document.getElementById('kind');
ele=ele.parentNode;
ele.style.display='none'; 
  
</script>
oder verstehe ich dich falsch
Mit Zitat antworten
  #5 (permalink)  
Alt 19.10.2018, 08:41
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

Danke für den Code, Bastian.


Das Skript wirkt leider nicht.


Ich habe es in folgendes Testcase eingefügt:


https://borumat.de/-/elternelement-ausblenden


Davon unabhängig:
Das Skript muss auch mit einem Class-Attribut funktionieren, nicht nur mit einem ID-Attribut.
__________________

Mit Zitat antworten
  #6 (permalink)  
Alt 19.10.2018, 08:52
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.995
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Das ist das selbe Skript wie ich es gepostet habe, nur dass ich es für Klassennamen und nicht für ID geschrieben habe.

"Das skript wirkt leider nicht" ist keine ausreichende Fehlerbeschreibung.

Poste doch dein Skript hier, dann können wir dir besser weiterhelfen.

edit:
Grundlagen von Javascript: Javascript wird sofort ausgeführt. Du führst dein Skript aus, wenn genau folgendes im html vorhanden ist:
Code:
<html>
<head>
<meta charset="UTF-8">
<title>Elternelement ausblenden</title>
<script>
ele=document.getElementById('kind');
ele=ele.parentNode;
ele.style.display='none';
</script>

In diesem Code-Abschnitt werden alle Elemente mit deiner ID ausgeblendet, danach wird der restliche Code geladen.

Du musst deinen Code ausführen wenn der DOM geladen ist.
Btw, Skripte kommen am Besten als letztes im body, dann würde dein Skript auch ohne on-dom-load funktionieren, aber sauberer ist es, auf einen fertigen DOM zu warten.

Wrappe deinen JS code mit folgender Funktion:
Code:
document.addEventListener("DOMContentLoaded", function() {
  // Code HIER wird erst ausgeführt wenn DOM geladen ist. 
});

Geändert von cloned (19.10.2018 um 08:56 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 19.10.2018, 09:06
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

Danke.


Mit Deinem "Wrapper" wird das Elternelement H1 ausgeblendet, wenn ich bei "GetElementByID" bleibe.
Nicht jedoch die Groß- und Urgroßeltern (DIV).
Das Vorfahrenelement BODY soll natürlich nicht ausgeblendet werden.



Du schreibst "Poste doch Dein Skript":

Ich habe ja sogar mehr getan und ein Testcase angelegt.


Am einfachsten kann man die Sache in dem Code Pen testen und nachvollziehen.

Ich habe das Testcase auf borumat.de wieder entfernt.

Du schreibst weiter oben von "Iterieren". Das ist mir noch nicht klar. Jedenfalls funktioniert "GetElementsByClassName" so wie es zur Zeit in CodePen steht nicht.
__________________


Geändert von AndreasB (19.10.2018 um 09:13 Uhr)
Mit Zitat antworten
  #8 (permalink)  
Alt 19.10.2018, 09:11
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.995
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Du verwendest .parent, damit gehst du genau ein Element nach oben in deinem DOM-Tree, das ist nun mal das H1. du kannst natürlich .parent öfter aufrufen, bis du dort bist, wo du hinwillst, zb ele.parentNode.parentNode.parentNode ....

Du kannst auch, wie ich schon geschrieben habe, .closest('div') verwenden, um zum nähesten div zu gehen (also immer ein Element nach oben bis du bei einem div bist (das sollte auch mit Klassennamen funktionieren)

edit: ja, dein skript habe ich danach dann gefunden, das habe ich zuerst übersehen. Sorry dafür.
Mit Zitat antworten
  #9 (permalink)  
Alt 19.10.2018, 09:32
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 jetzt



ele=ele.closest('div');


in den Code Pen eingefügt.
So klappt es nicht.


Am einfachsten wäre es vielleicht, wenn Du den Code Pen forkst und es in richtiger Weise einträgst. Denn mein Code enthält ja offenbar noch Fehler.
__________________

Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 19.10.2018, 09:38
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 1.995
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
Am einfachsten wäre es vielleicht, wenn Du den Code Pen forkst und es in richtiger Weise einträgst. Denn mein Code enthält ja offenbar noch Fehler.
Welchen Code Pen? dein beispielcode wurde gelöscht wenn ich das richtig sehe.
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 10:05 Uhr.