Beiträge von Arne Drews

Grundsätzlich ist die Kernfrage nicht zu beantworten, da es immer auf den Anwendungsfall ankommt. In Deinem Fall würde ich aber zu der Variante tendieren, für jede Filterung eine neue Abfrage zu feuern. Ich denke, die Abfrage über alles könnte mit der Zeit ( Datenbanken füllen sich ja idealer Weise im Laufe der Zeit ) sehr mächtig werden und bspw. zu Überlauffehlern führen. Eine Abfrage für jede neue Filterung sollte demnach schneller sein ( sofern sie optimiert ist ) und ist ja heutzutage für den Anwender der AJAX Technologie kaum spürbar.

Zitat von Sempervivum

Alles holen und clientseitig filtern:

Das erste Laden dauert länger aber die Umschaltung des Filters geht schnell.

Nicht zwingend. Die komplette Datenmenge muss ja irgendwo zwischengespeichert werden. Ich werfe einfach mal die Behauptung in den Raum, dass das in Objekten oder Arrays der Scriptsprache passiert. Die kann bei sehr großen Datenmengen aber auch einige Zeit in Anspruch nehmen und im schlimmsten Fall zu einem Out of Memory führen.

Entweder bekommst Du das CSS seitig mit @media Rules hin, oder halt per JavaScript das Resize-Event befüttern...

Der Klassiker wäre, wenn Du HTML und BODY nicht auf margin:0; padding:0; gesetzt hast.

Da funktioniert die Anpassung aber doch auch erst, nachdem er neu lädt...

Sieht ein wenig danach aus, als würdest Du nach CSS Präprozessoren, wie SASS oder LESS suchen?

Der Grund erschließt sich mir hier allerdings nicht.

Zunächst mal hat der erste Code mit dem zweiten gar nichts zu tun. Das eine ist ein Eventhandler, das andere eine Abfrage der location. Beide haben jeweils einen anderen Zweck.

$(document).ready(function() {
    ...
}

ist, wie DER schon geschrieben hat eine Funktionalität der jQuery Library. In reinem JavaScript sähe das Äquivalent bspw. so aus:

document.addEventListener( 'DOMContentLoaded', function() {
    ...
});

Das ganze ( egal, welche Variante ) sorgt lediglich dafür, dass alles innerhalb der function erst ausgeführt wird, wenn alle Elemente des Dokument geladen sind, das Dokument also vollständig ist. Damit wird verhindert, dass man bspw, nicht auf ein Element zugreift, das evtl. noch gar nicht geladen wurde, da HTML sequentiell von oben nach unten abgearbeitet wird.

Zitat von didi577

Worin lkiegt der Unterschied? Was ist richtig oder falsch? Wo kann mir das "auf die Füße fallen"?

Wie gesagt hat das eine mit dem anderen nichts zu tun. Ob richtig oder falsch kann man aufgrund der paar gezeigten Zeilen nicht wirklich beantworten. Die zweite Variante macht für mich allgemein wenig Sinn, zumindest habe ich selber für so eine Abfrage noch keinen relevanten Fall gehabt.

Auf die Füße fallen kann Dir das aus meiner Sicht nicht, da die location schon zur Verfügung steht, bevor das Dokument vollständig geladen ist.

Ob jQuery nun so eine große Hilfe und Erleichterung ist, sehe ich persönlich etwas anders. Für mich ist jQuery absolut überbewertet und nur in schätzungsweise 5% aller Fälle evtl. notwendig ( Zahl einfach mal in den Raum geworfen! ). Die große Selektionsfähigkeit von jQuery ist bspw. mit ca. 3kB Scriptaufwand mindestens genauso gut reproduzierbar. Was Animationen angeht, die ich mit CSS3 nicht hinbekomme, da macht jQuery vielleicht Sinn. Aber wann habe ich den Fall mal...

Die Meta-Description wird von Google ignoriert, solange ausreichend Text im Content gefunden wird. Die Keywords werden m.M.n. allerdings schon berücksichtigt, haben allerdings lange nicht eine so hohe Gewichtung, wie der Content.

Als kleine Notiz am Rande: cURL ist fast immer file_get_contents() & Co. vorzuziehen, da diese Funktionen alle auf fopen() basieren. Und diese Funktion erlaubt nur den Zugriff auf externe Quellen, wenn die Direktive allow_url_fopen in der PHP Konfiguration aktiviert ist. Dies ist zwar in vielen Fällen so, aber eben nicht in allen. Sollte man mal in die Verlegenheit kommen, auf einen Webspace zu wechseln, der diese Direktive nicht aktiviert hat, funktionieren solche Dinge dann plötzlich nicht mehr.

cURL funktioniert immer und gehört zu Standard-Paketen bei PHP. Es lohnt sich, darauf zurückzugreifen.

Sollte man öfter in die Verlegenheit kommen, cURL nutzen zu wollen/müssen, kann man sich einen Wrapper schreiben, der alles etwas vereinfacht.

...und reCaptcha sind mindestens genauso nervig.

Selektiere einfach nach den href-Attributen, die Du schon markiert hast:

A[href="foobar"] { display:none; }

Dann zeig doch mal Deinen Code, insbesondere, wie Du das Bild lädst.

Ich verstehe die Frage ehrlich gesagt nicht. Egal womit eine Website erstellt wird, am Ende wird immer noch HTML ausgespuckt, weil das die Browser interpretieren. Will ich vernünftig an dem Layout einer Website etwas anpassen können oder selbst in der Lage sein,eine von Grund auf zu erstellen, benötige ich HTML. Man sollte sich sowieso nie auf irgendwelche Generatoren verlassen, die produzieren in den meisten Fällen ganz schönen Mist.

Browser => F12 => Konsole => JavaScript-Fehler vorhanden?

Wenn ja, lösen.

Hi,

Geht es Dir um das INSERT/UPDATE oder um die SELECT-Abfrage?

Für beide Fälle ist auf jeden Fall notwendig zu wissen, wie Deine Datenbank Tabellen aufgebaut sind.

SVG wäre auch noch zu nennen

Das ist grundsätzlich egal. Es gibt sicher bessere Programme, aber wenn Du damit gut zurecht kommst und für Dich passable Ergebnisse erhältst, kannst Du auch das nehmen. Später würde ich allerdings noch versuchen, das Bild gegen eine HTML/CSS Basis auszutauschen. Das wird etwas aufwendiger, aber Du hast dann viel mehr Möglichkeiten, bspw. kannst Du Probleme mit den mathematischen Algorithmen bekommen, wenn Du die Berechnungen und das Bild testweise für eine 1920x1080 zusammenfrickelst und dann auf 1024x768 spielen willst.

Könnte ich mir vorstellen... ohne das jetzt im Detail durchdacht zu haben.

Egal, klein anfangen ist gut. Die Freude darüber steigert den Ehrgeiz den nächsten Schritt zu wagen.

Zitat von Enrico Michael

einen Tisch konstruieren und erstmal 2 Kugeln, mit denen ich dann schon einmal rumexperimentieren kann ( mathematische Formeln und Physik )

Das ist der richtige Weg! Es wird ziemlich komplex, aber fast alles lässt sich tatsächlich mit Mathe und Physik berechnen. So würde ich vermutlich auch rangehen.

Ich würde ja auch onclick verzichten und die Logik komplett in JS auslagern. Die Texte ( je nach Länge und produktiver Verwendung ) kann ich auch an den dataset der Schaltflächen setzen und direkt drauf zugreifen.

Beispiel ( für multi row ):

<div class="row">
  <div class="content">default</div>
  <button data-text="new text #1">Change #1</button>
  <button data-text="new text #2">Change #2</button>
  <button data-text="new text #3">Change #3</button>
</div>
<div class="row">
  <div class="content">default</div>
  <button data-text="new text #1">Change #1</button>
  <button data-text="new text #2">Change #2</button>
  <button data-text="new text #3">Change #3</button>
</div>

var _btn = document.querySelectorAll('button');

_btn.forEach( i => {
  i.addEventListener('click', function(e) {
    _content = this.closest('div').querySelector(':scope .content');
    _content.innerHTML = this.dataset.text;
  });
});

Hinweis: Für IE und Edge müssen kleine Anpassungen gemacht werden, die ich hier aufgrund der Übersichtlichkeit und bewusst weggelassen habe!

Warum auf die Weise?

Weil ich so mein JavaScript so gut wie nie wieder anpassen muss! Du kannst so viele rows dazu packen, wie Du möchtest, das JavaScript funktioniert automatisch für alle. Vorausgesetzt natürlich, die HTML Auszeichnung ist immer korrekt.

Warum kein onclick?

Weil ich damit das Standard Klick-Ereignis des Elements überschreibe, addEventListener() erweitert das Standard Ereignis lediglich. Benötige ich das wirklich nicht, gibt es die Event-Methoden preventDefault() oder stopPropagation(). So kann ich steuern, o ich mich an das Ereignis ranhänge oder wirklich komplett neu schreiben will.

Fangen wir mal vorne an... Für einen Vergleich eine Prüfung benötigst Du grundlegend mind. zwei Werte. Ganz grundlegend sähe das so aus:

var IsEqual = value1 == value2;

Bei Dir ist value2 aber eine Collection ( Array, Objekt o.ä. ), d.h. Du musst prüfen, ob value1 in value2 enthalten ist, das sähe für Arrays so aus:

var IsEqual = value2.includes( value1 );

Jetzt müsstest Du also ein Array haben, das alle Werte aus dem Wörterbuch enthält, also benennen wir mal value2 in dictionary und value1 in word um und fügen Beispieldaten ein:

var dictionary = ["hallo","welt"];
var word = "Welt";

WordExists = dictionary.includes( word ); // liefert false, da CaseSensitive geprüft wird
WordExists = dictionary.includes( "welt" ); // liefert true

Auf der Basis sollte das aufgebaut sein. Aber ich denke, hier sieht man relativ schnell, dass Du erstmal Dein Wörterbuch haben müsstest. Es macht bspw. keinen Sinn, alle Wörter in ein JavaScript-Array zu pflanschen. Da würde ich lieber auf einen Ajax-Request zurückgreifen, der die Wörter über eine Datenbank prüft.