RER- und MER-Rechner für Hunde
RER- und MER-Rechner für Hunde ?
In diesem Artikel werfen wir einen detaillierten Blick auf den Code für den Rechner für den Ruheenergiebedarf (RER) und den Wartungsenergiebedarf (MER) von Hunden und erklären jeden Teil des Codes, seinen Zweck und wie man ihn verbessern kann. Wenn Sie den Code testen möchten, klicken Sie hier ??.
Mit diesem webbasierten Tool können Tierhalter den Kalorienbedarf ihres Hundes basierend auf Gewicht, Lebensphase und Aktivitätsgrad berechnen. Die Berechnung umfasst zwei Hauptformeln: eine für den Ruheenergiebedarf (RER) und eine für den Erhaltungsenergiebedarf (MER).
HTML-Struktur ?️
Infrastruktur:
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="计算您狗狗的静息能量需求 (RER) 和维持能量需求 (MER)..."> <meta name="keywords" content="狗狗 RER 计算器,狗狗 MER 计算器,狗狗营养,宠物卡路里计算器,静息能量需求,维持能量需求"> <meta name="author" content="您的网站名称"> <title>狗狗 RER 和 MER 计算器</title>
- Der Code beginnt mit einer Standard-HTML5-Struktur. Der
<meta>
-Tag ist entscheidend für SEO und beschreibt den Inhalt der Seite.
Das Tag <title>
hilft Suchmaschinen und Browsern, das Thema der Seite zu verstehen.
Formularelemente:
<label for="weight"> 狗狗体重 (公斤): <input type="number" id="weight" required> </label>
- Der Benutzer gibt sein Gewicht in ein Feld vom Typ Zahl ein und stellt sicher, dass nur numerische Werte akzeptiert werden.
- Das Attribut „erforderlich“ stellt sicher, dass die Eingabe vor dem Absenden ausgefüllt werden muss.
CSS-Layout und responsive Stile?
Wir verwenden CSS, um den Rechner zu gestalten und sicherzustellen, dass er auf allen Bildschirmgrößen gut aussieht. Hier ist eine Aufschlüsselung des angewendeten CSS:
body.rer-body { font-family: 'Arial', sans-serif; margin: 0; padding: 20px; background-color: #f9f9f9; box-sizing: border-box; }
- Der Textkörper hat eine helle Hintergrundfarbe, Polsterung für Abstände und eine einheitliche Schriftart für einfaches Lesen.
- Der Titel ist zentriert, in Türkis und mit angemessenem Abstand gestaltet.
JavaScript-Berechnungsfunktion?
Die Kernfunktionalität ist hier. Dieses Skript nimmt Eingaben entgegen, führt Berechnungen durch und zeigt die Ergebnisse dynamisch an.
function calculateRER() { const weight = parseFloat(document.getElementById('weight').value); const age = document.getElementById('age').value; const activity = document.getElementById('activity').value; if (isNaN(weight) || weight <= 0) { alert('请输入有效的体重!'); return; } let rer = 70 * Math.pow(weight, 0.75); let mer = rer; // 根据生命阶段和活动水平调整 MER if (age === 'puppy') { mer *= 2; // 幼犬乘以2 } else if (age === 'senior') { mer *= 1.2; // 老年犬乘以1.2 } if (activity === 'high') { mer *= 1.6; // 高活动量乘以1.6 } else if (activity === 'moderate') { mer *= 1.4; // 中等活动量乘以1.4 } const resultDiv = document.getElementById('rer-result'); resultDiv.innerHTML = ` <p><strong>狗狗体重:</strong> ${weight} kg</p> <p><strong>生命阶段:</strong> ${age}</p> <p><strong>活动水平:</strong> ${activity}</p> <p><strong>静息能量需求 (RER):</strong> ${rer.toFixed(2)} kcal/天</p> <p><strong>维持能量需求 (MER):</strong> ${mer} kcal/天</p> `; resultDiv.style.display = 'block'; }
Code-Erklärung:
- Wir beginnen mit dem Extrahieren der Eingabewerte (Gewicht, Lebensphase und Aktivitätsniveau) aus dem HTML-Formular.
- Wir prüfen, ob das Gewicht gültig ist („isNaN(weight)“ stellt sicher, dass es eine Zahl ist und „weight > 0“).
- Ruheenergiebedarf (RER) Berechnet nach der Formel: 70 * Gewicht^0,75.
- Wir verwenden Multiplikatoren, um den Erhaltungsenergiebedarf (MER) basierend auf dem Lebensstadium (Welpe, erwachsener oder älterer Hund) und dem Aktivitätsniveau (niedrig, mittel, hoch) anzupassen.
- Schließlich zeigen wir die Ergebnisse dynamisch im Div „rer-result“ an.
Codetests?
Sie können hier klicken, um den Code online zu testen. Dies ist eine großartige Möglichkeit, Ihre Berechnungen in Aktion zu sehen und zu überprüfen, ob alles wie erwartet funktioniert.
Wie kann dieser Code verbessert werden?
Fühlen Sie sich frei, den Code zu verbessern! Hier sind einige Bereiche, in denen Sie die Funktionalität verbessern können:
- Verbesserte Eingabevalidierung : Stellen Sie sicher, dass alle Felder gründlich validiert werden und benutzerfreundliche Fehlermeldungen bereitstellen.
- Einheitenumrechnung: Ermöglicht Benutzern das Umschalten von Gewichts- und Aktivitätsniveaus zwischen metrischen und imperialen Einheiten.
- Responsive Design-Verbesserungen: Stellen Sie sicher, dass sich das Design besser an kleinere Bildschirme (z. B. mobile Geräte) anpasst.
- Funktion hinzugefügt: Fügen Sie für genauere Berechnungen zusätzliche Felder wie Rasse oder Alter in Monaten hinzu.
Teilen Sie mir Ihre Verbesserungsvorschläge in den Kommentaren unten mit! ?
Wenn Sie diese detaillierten Schritte befolgen, können Sie den Code verstehen, optimieren und sogar zur Verbesserung beitragen. Viel Spaß beim Codieren! ?
Das obige ist der detaillierte Inhalt vonRER- und MER-Rechner für Hunde. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen











Neulich habe ich dieses besonders schöne Stück von der Website von Corey Ginnivan entdeckt, auf der eine Sammlung von Karten aufeinander stapelt.

Ich sehe, dass Google -Schriftarten ein neues Design (Tweet) ausgelöst haben. Im Vergleich zur letzten großen Neugestaltung fühlt sich dies viel iterativer an. Ich kann den Unterschied kaum erkennen

Haben Sie jemals einen Countdown -Timer für ein Projekt benötigt? Für so etwas ist es möglicherweise natürlich, nach einem Plugin zu greifen, aber es ist tatsächlich viel mehr

Alles, was Sie schon immer über Datenattribute in HTML, CSS und JavaScript wissen wollten.

Wenn die Anzahl der Elemente nicht festgelegt ist, wählen Sie das erste untergeordnete Element des angegebenen Klassennamens über CSS aus. Bei der Verarbeitung der HTML -Struktur begegnen Sie häufig auf verschiedene Elemente ...

Fragen zu lila Schrägstrichen in Flex -Layouts Bei der Verwendung von Flex -Layouts können Sie auf einige verwirrende Phänomene stoßen, wie beispielsweise in den Entwicklerwerkzeugen (D ...

Zu Beginn eines neuen Projekts erfolgt die SASS -Zusammenstellung im Blinzeln eines Auges. Dies fühlt sich gut an, besonders wenn es mit Browsersync kombiniert ist, das nachlädt

So implementieren Sie Windows-ähnlich in der Front-End-Entwicklung ...
