suchen

Heim >Web-Frontend >js-Tutorial >Anwendung der Dom-Programmierung in js: Abrufen von HTML-Elementen, js-String-Operationen und js-Zahlenoperationen

Anwendung der Dom-Programmierung in js: Abrufen von HTML-Elementen, js-String-Operationen und js-Zahlenoperationen

不言
不言Original
2018-08-14 17:09:331477Durchsuche

In diesem Artikel geht es um die Anwendung der Dom-Programmierung in js: Erhalten von HTML-Elementen, js-String-Operationen und js-Digitaloperationen. Ich hoffe, dass dies der Fall ist hilfreich für dich. Du hast geholfen.

DOM-Programmierung:
Was ist DOM: DOM bezieht sich auf das Struktursystem von HTML. Wir nennen diesen Baum das DOM-Modell und beziehen uns auf die Verwendung von Code zum Betreiben der Knoten und Knoten in diesem Baum 🎜>

1. HTML-Element abrufen: Unser HTML wird von js als Dokumentobjekt betrachtet. js bietet viele Methoden für das Dokument, um HTML-Elemente abzurufen und HTML-Elemente zu betreiben: 

   <html>
    <head>

        <script>
            function zhanghao() {
                //获取html元素
                var yuansu = document.getElementById("zhangsan2");
                alert(yuansu);
            }        </script>

    </head>

    <body>
        <form>
            账号：<input id="zhanghao1" type="text"><br>
            密码：<input id="zhangsan2" type="password"><br>
            <input type="submit" value="登录"><br>
            <button onclick="zhanghao()"> 获取账号 </button>
        </form>

    </body></html>

Durch das Programm haben wir festgestellt, dass nach der Änderung der Methode zum Abrufen von Elementen Folgendes vorliegt Sie erhalten, ist ein HTMLInputElement-Objekt, also was ist ein Objekt? Ein Objekt ist eine Abstraktion einer Sache. Unter Abstraktion versteht man die Beschreibung einer Sache durch Variablen. Über dieses Objekt können wir auf Attribute zugreifen, beispielsweise auf die Attribute im HTML-Eingabeobjekt: 

function zhanghao() {
                //获取html元素
                var yuansu = document.getElementById("zhanghao1");

                yuansu.style.color = "red";
                yuansu.value= "zhangsan";
            }

Verwenden Sie js, um zu überprüfen, ob das Kontokennwort leer ist: 

<html>
    <head>

        <script>

            //我们验证账号是否为空， 密码是否为空，如果为空，弹出请输入账号/密码
            function yanzheng() {

                var zhanghao = document.getElementById("zhanghao1").value;                var mima = document.getElementById("zhanghao2").value;                if(zhanghao == &#39;&#39;) {
                    alert("请输入 账号！");
                }   
                if(mima == &#39;&#39;) {
                    alert("请输入密码!");
                }

            }        </script>
    </head>

    <body>
        <form>
            账号：<input  id="zhanghao1" type="text" ><br>
            密码：<input id="zhanghao2" type="password"><br>
            <input type="submit" value="登录"><br>
            <input type="reset" value="重置">
            <a onclick="yanzheng()"> 验证账号密码 </a>
        </form>

    </body></html>

js-String-Operation
Stringlänge abrufen: Durch Abrufen der Attributlänge

//账号的长度必须是6-18位
                var changdu = zhanghao.length;                
                if(6>changdu || changdu > 18) {
                    alert("请输入6-18位的账号！");
                }

字符串常用方法：//常用字符串方法
                var zhanghao = "abcdefg"
                alert(zhanghao.charAt(0)); //根据下标返回对应的字符
                alert(zhanghao.concat("===","++++","&&&&"));//拼接字符串，和+类似
                alert(zhanghao.indexOf("m"));  //判断是否包含某个字符串

                var word="you are SB";
                alert(word.replace("SB","***"));  //替换字符串

                document.write("X" + "1".sub());    //下标
                document.write("X" + "2".sup());    //上标


                var zhanghao = "zhangsan ni hao ";
                document.write(zhanghao.substr(3,4) + "...");  //截取字符串
                document.write(zhanghao.substring(3,4));
js的获取日期：//获取当前操作系统的时间
                var xianzai = new Date();
                document.write(xianzai.toLocaleString());

js mathematische Operation: Math

                document.write("<br>");
                document.write(Math.pow(2,3)); 
                document.write("<br>");
                document.write(Math.pow(2,10));
                document.write("<br>");
                document.write(Math.sqrt(2));

                document.write("<br>");
                document.write(Math.random()); //计算随机数

Verwandte Empfehlungen:

Natives js-Paar Welche Operationen können im DOM ausgeführt werden? Wie man DOM mit nativem js betreibt

JS-Grundlagen DOM- und BOM-Programmierung

Javascript- und DHTML-Beispielprogrammierung (Tutorial) DOM-Grundlagen und Basic API_Basic Knowledge

Das obige ist der detaillierte Inhalt vonAnwendung der Dom-Programmierung in js: Abrufen von HTML-Elementen, js-String-Operationen und js-Zahlenoperationen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Was sind Argumente in js? So verwenden Sie Argumente in jsNächster Artikel：Was sind Argumente in js? So verwenden Sie Argumente in js

In Verbindung stehende Artikel

Mehr sehen