recherche
Maisoninterface Webjs tutorielobjets javascript intégrés (contenu partiel)

Objet texte

L'objet texte représente un champ de saisie de texte dans un formulaire HTML. Chaque fois que input type="text apparaît dans un formulaire HTML, un objet Text sera créé.
disabled Définit ou renvoie si le champ de texte doit être désactivé. (Il n'y a que deux valeurs : true et false)
readOnly Définit ou renvoie Si le champ de texte doit être en lecture seule (peut uniquement être lu, ne peut pas être modifié). (Il n'y a que deux valeurs : vrai et faux)
value définit ou renvoie la valeur de l'attribut value du texte. champ dans
focus(). Définissez le focus sur le champ de texte

        <form>
            <input name="wd" />
            <input type="button" onclick="onesubmit()" value= "搜索" />
        </form>
        <script>
            var form = document.getElementsByTagName("form")[0];
            form.action = "https://www.baidu.com/s";            var text = document.getElementsByName("wd")[0];            function onesubmit(){
                text.value = "中国";//设置或返回文本域的 value 属性的值
                console.log(text.value);
                text.focus();//在文本域上设置默认焦点
                text.readOnly = true;//设置或返回文本域是否应是只读的 即不能更改
                text.disabled = true;//设置或返回文本域是否应被禁用,即不能使用
            }        </script>
objet radio

L'objet radio représente le bouton radio dans le formulaire HTML. . L'état du bouton radio. (vrai et faux)

disabled Définit ou renvoie si le bouton radio est désactivé.

value Définit ou renvoie la valeur de l'attribut value du bouton radio. case à cocher dans un formulaire HTML.


checked définit ou renvoie l'état d'un bouton à sélection multiple
disabled définit ou renvoie si un bouton doit être désactivé. Définit ou renvoie la valeur de l'attribut value de la case à cocher. :

Sélectionner un objet

Sélectionner un objet représente une liste déroulante dans un formulaire HTML 🎜>options[ ] Renvoie un tableau contenant toutes les options de la liste déroulante <.>disabled Définit ou renvoie si la liste déroulante doit être désactivée.

length Renvoie le nombre d'options dans la liste déroulante. Le numéro d'index de l'élément sélectionné dans la liste. >add() Ajoute une option à la liste déroulante
remove() Supprime une option de la liste déroulante >
Option(text,value) crée un objet Option via du texte (c'est-à-dire, la valeur entre les balises d'option) et la valeur valeur

selected définit ou renvoie la valeur de l'attribut sélectionné (vrai ou faux, c'est-à-dire s'il est sélectionné)

text Définit ou renvoie la valeur en texte brut d'une option.

value Définit ou renvoie la valeur envoyée au serveur
<body>
        <form onsubmit="return check()">
            用户名<input name="user_name" id="user_name" /><br />
            密码<input name="password" id="password" type="password" /><br />
            确认密码<input name="pw_check" id="pw_check" type="password" /><br />
            <input type="reset" value="重置" />
            <input type="submit" value="注册" />
            <input type="radio" name="sex" value="男" />男            <input type="radio" name="sex" value="女" />女            <input type="checkbox" name="hobby" value="篮球" />篮球            <input type="checkbox" name="hobby" value="羽毛球" />羽毛球            <input type="checkbox" name="hobby" value="乒乓球" />乒乓球            <input type="checkbox" name="hobby" value="足球" />足球            <select name="choose" id="choose">
                <option value="gaoyi">高一</option>
                <option value="gaoer">高二</option>
                <option value="gaosan">高三</option>
            </select>
        </form>
        <span id="msg" style="color: red;"></span>

        <script>

            function $(id){
                return document.getElementById(id);
            }            function check(){
                var selects = document.getElementById("choose");
                selects.disabled=true;
                console.log(selects.length);
                console.log(selects.selectedIndex);                var options = selects.options;                for(var i=0;i<options.length;i++){
                    console.log(options[i].value)
                }
                console.log("$$$$$$$$$$$$$$$$$$$$$$$$$$$$");                var radios = document.getElementsByName("sex");                for(var i=0;i<radios.length;i++){

                    console.log(radios[i].checked+radios[i].value);
                }
                radios[0].cheked=true;
                radios[0].disabled=true;

                console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");                var checkboxes = document.getElementsByName("hobby");                for(var i=0;i<checkboxes.length;i++){

                    console.log(checkboxes[i].checked+checkboxes[i].value)
                }
                checkboxes[2].checked=true;
                checkboxes[2].disabled=true;
                console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");                var user_name = $("user_name").value;                var password = $("password").value;                var pw_check = $("pw_check").value;                if(user_name.length==0){
                    $("msg").innerHTML = "用户名不能为空";                    return false;
                }                else if(user_name.length>12){
                    $("msg").innerHTML = "用户名不能超过12个字符";                    return false;
                }                if(password.length==0){
                    $("msg").innerHTML = "密码不能为空"
                    return false;   
                }                else if(password.length>15){
                    $("msg").innerHTML = "密码不能超过12个字符";                    return false;
                }                if(password!=pw_check){
                    $("msg").innerHTML = "密码不一致";                    return false;
                }
                console.log("注册成功")                return false;
            }        </script>
    </body>
par exemple :

objet element Dans HTML DOM, l'objet Element représente un élément HTML. nœud d'élément, nœud de texte et nœud de commentaire. Obtenez l'objet Element via la méthode getElementById(), getElementsByTagName() ou getElementsByName() de l'objet Document.

element.className définit ou renvoie l'attribut de classe de l'élément.
element.innerHTML définit ou renvoie le contenu de l'élément.
element.style Définit ou renvoie l'attribut de style de l'élément.
element.parentNode renvoie le nœud parent de l'élément en tant qu'objet Node.

par exemple :

L'exemple ci-dessus imite l'effet du changement d'étiquette et de l'affichage du contenu en déplaçant la souris sur la page Sina.


Objet fenêtre

En fait, l'historique, le document et d'autres objets couramment utilisés appartiennent à l'objet fenêtre, mais l'objet fenêtre est une variable globale et "fenêtre" est généralement omis lors de l'utilisation. .

objet document
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <select id="selected">
            <option value="小学一年级">一年级</option>
            <option value="小学二年级">二年级</option>
            <option value="小学三年级">三年级</option>
            <option value="小学四年级">四年级</option>
            <option value="小学五年级">五年级</option>
            <option value="小学六年级">六年级</option>
        </select>
        <input type="button" onclick="test()" value="按钮" />
        <script>
            function test(){
                var selects = document.getElementById("selected");
                console.log(selects.disabled);
                console.log(selects.selectedIndex);
                console.log(selects.length);
                console.log("@@@@@@@@@@@@@@@@@@@@@@@@");                var options = selects.options;
                console.log(options[selects.selectedIndex]);
                console.log("$$$$$$$$$$$$$$$$$");                for (var i=0;i<options.length;i++){
                    console.log(options[i].value);
                    console.log(options[i].selected);
                    console.log(options[i].text);
                }
                console.log("######################");                var option1 = new Option("初一","初中一年级");                var option2 = new Option("初二","初中二年级");                var option3 = new Option("初三","初中三年级");
                selects.add(option2);
                selects.add(option1);
                selects.remove(6);
                selects.add(option2);
                selects.add(option3);
                selects.remove(0);
                selects.remove(0);
                selects.remove(0);
                selects.remove(0);
                selects.remove(0);
                selects.remove(0);
            }        </script>
    </body></html>

domain renvoie le nom de domaine du document actuel, par exemple : www.blue-bridge.com

URL renvoie l'URL du document actuel, par exemple : http ://www.blue-bridge.com/venus/login.jsp

getElementById() Renvoie une référence au premier objet avec l'identifiant spécifié.

getElementsByName() renvoie une collection d'objets avec le nom spécifié.

getElementsByTagName() renvoie une collection d'objets avec le nom de balise spécifié.

objet historique

back() charge l'URL précédente dans la liste d'historique, de la même manière que le bouton "retour".

forward() charge l'URL suivante dans la liste de l'historique, de la même manière que le bouton "suivant".

go() charge une page spécifique dans la liste d'historique, history.go(-1)//est équivalent à back().
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <script>
        function news(){
            var elements1 = document.getElementById("news");
            elements1.className = "selected";            var elements2 = document.getElementById("see");
            elements2.className = "fault";            var elements3 = document.getElementById("list1");
            elements3.className = "visited";            var elements3 = document.getElementById("list2");
            elements3.className = "unvisited";
        }        function see(){
            var elements = document.getElementById("news");
            elements.className = "fault";   
            var elements2 = document.getElementById("see");
            elements2.className = "selected";            var elements3 = document.getElementById("list1");
            elements3.className = "unvisited";            var elements3 = document.getElementById("list2");
            elements3.className = "visited";
        }    </script>
    <style>
        body {            color: #333;            padding: 5px 0;            font: 12px/20px "SimSun","宋体","Arial Narrow",HELVETICA;            background: #fff;        }
        a{            color: #666;            text-decoration: none;        }
        a:visited{            color:#666;        }
        p{            display: block;        }
        #main{            position: relative;            display: block;            height: 34px;            width: 356px;            border: 1px solid #dbdee1;            line-height: 34px;            background: url(img/bg1px.png) 0 -33px repeat-x;            zoom: 1; /*缩放比例*/
        }
        #main:after{            content: ".";            display: block;            height: 0;            clear: both;            visibility: hidden;/*隐藏h2标签*/
        }
        #main #menu{            float: left;            margin-left: -2px;        }
        #main #menu span{            float: left;            height: 35px;            line-height: 35px;            font-size: 16px;            font-family: "Microsoft YaHei","微软雅黑","SimHei","黑体";            padding: 0 13px;            margin-top: -1px;        }
        #main #menu .selected{            height: 33px;            line-height: 29px;            border-top: 3px solid #ff8400;            border-left: 1px solid #dbdee1;            border-right: 1px solid #dbdee1;            background-color: #fff;            _position: relative;            _margin-bottom: -1px;            padding: 0 12px;            border-left: 0;            padding-left:13px ;        }
        #main #date{            float: right;            display: inline;            margin-right: 10px;        }
        #list1{            position: absolute;        }
        #list2{            position: absolute;        }
        #list1 a{            color: #122e67;            text-decoration: none;        }
        #list1 a:visited{            color: #52687e;            text-decoration: none;        }
        #list2 a{            color: #122e67;            text-decoration: none;        }
        #list2 a:visited{            color: #52687e;            text-decoration: none;        }
        .visited{            display: block;        }
        .unvisited{            display: none;        }
        ul{            height: auto;            height: 208px;            overflow: hidden;            clear: both;            list-style: none;            display: block;        }
        ul li{            padding-left: 10px;            line-height: 26px;            height: 26px;            overflow: hidden;            font-size: 14px;            background: url(//i0.sinaimg.cn/home/main/index2013/0403/icon.png) no-repeat 0 -881px;            _zoom: 1;        }
    </style>
    <body>
        <p id="main">
            <p id="menu">
                <span id="news" class="selected" onmouseover="news()">
                    <a href="http://news.sina.com.cn/" target="_blank">新闻</a>
                </span>
                <span id="see" class="fault" onmouseover="see()">
                    <a href="http://henan.sina.com.cn/" target="_blank">看河南</a>
                </span>
            </p>
            <span id="date">2018.8.6</span>
        </p>
        <!--main end-->
        <p id="list1" class="visited">
            <ul>
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/c/xl/2018-08-06/doc-ihhhczfc3414364.shtml">习近平对王继才先进事迹作出重要指示</a>
                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/gov/xlxw/2018-08-06/doc-ihhhczfc3730191.shtml">习近平引领科技强军路</a>
                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/c/2018-08-06/doc-ihhhczfc1300781.shtml">构建更加紧密的中非命运共同体</a>
                    <a target="_blank" href="http://news.sina.com.cn/zt_d/djbl/">大江奔流</a>
                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/o/2018-08-06/doc-ihhhczfc1539880.shtml">人民日报评论员:积极进取 引领中国经济行稳致远</a>
                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/c/nd/2018-08-06/doc-ihhhczfc6968447.shtml">百白破你真的了解吗?</a>
                    <a target="_blank" href="http://news.sina.com.cn/o/2018-08-06/doc-ihhhczfc6967406.shtml">关于免疫和疫苗安全的问答</a>
                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/c/nd/2018-08-05/doc-ihhhczfc0144855.shtml">经济日报连发五文 解读当前经济形势</a>
                    <a target="_blank" href="http://news.sina.com.cn/o/2018-08-06/doc-ihhhczfc1656430.shtml">三大关键词</a>
                </li>       
                <li><a target="_blank" href="http://news.sina.com.cn/o/2018-08-06/doc-ihhhczfc1674641.shtml">用不靠谱的手段耍弄世界 注定不能让美国再次伟大</a>

                </li>       
                <li><a target="_blank" href="http://news.sina.com.cn/c/2018-08-06/doc-ihhkusks5999396.shtml">全国网络安全员法制与安全知识竞赛报名网站已开启</a>

                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/c/2018-08-06/doc-ihhhczfc3323403.shtml">特朗普揶揄中国股市 但不小心暴露自己一个硬伤</a>
                </li>       
                <li>
                    <a target="_blank" href="http://news.sina.com.cn/zx/2018-08-06/doc-ihhhczfc6757917.shtml">上海机场(集团)有限公司董事长吴建融被查</a>
                </li>
            </ul>
        </p>
        <!--list1 end-->
        <p id="list2" class="unvisited">
            <ul>
                <li>
                    <a href="http://henan.sina.com.cn" target="_blank">177家违规网站被通报 河南全面清退县级以下政府网站</a>
                </li>
                <li>
                    <a target="_blank" href="http://henan.sina.com.cn">河南四家长联名举报质疑考生答题卡掉包 官方回应</a>
                </li>
                <li>
                    <a target="_blank" href="http://henan.sina.com.cn/news/z/2018-08-07/detail-ihhkusks7863084.shtml">央视新闻联播聚焦河南 34条洲际航线扩展开放触角</a>
                </li>
                <li>
                    <a target="_blank" href="http://henan.sina.com.cn/news/m/2018-08-07/detail-ihhkusks7805180.shtml">河南开展幼儿园"小学化"治理:幼儿园严禁教小学课程</a>
                </li>
                <li>
                    <a target="_blank" href="http://wx.sina.com.cn/news/2018-08-06/detail-ihhhczfc2526781.shtml">百城致敬40年:专注粮油研究半个世纪</a>
                </li>
                <li>
                    <a target="_blank" href="http://henan.sina.com.cn/news/zhuazhan/2018-08-07/detail-ihhkusks7771435.shtml">周末夜查+夜间突击检查 河南"夜查"行动将持续至年底</a>
                </li>
            </ul>
        </p>
        <!--list2 end-->
    </body>

Recommandations associées :

Exemple d'application d'objet TextRange pour le traitement d'une partie du contenu du texte

Objet intégré unique de "JavaScript Adventure"


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
es6数组怎么去掉重复并且重新排序es6数组怎么去掉重复并且重新排序May 05, 2022 pm 07:08 PM

去掉重复并排序的方法:1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句,去掉数组中的重复元素,返回去重后的新数组;2、利用sort()对去重数组进行排序,语法“去重数组.sort()”。

JavaScript的Symbol类型、隐藏属性及全局注册表详解JavaScript的Symbol类型、隐藏属性及全局注册表详解Jun 02, 2022 am 11:50 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于Symbol类型、隐藏属性及全局注册表的相关问题,包括了Symbol类型的描述、Symbol不会隐式转字符串等问题,下面一起来看一下,希望对大家有帮助。

原来利用纯CSS也能实现文字轮播与图片轮播!原来利用纯CSS也能实现文字轮播与图片轮播!Jun 10, 2022 pm 01:00 PM

怎么制作文字轮播与图片轮播?大家第一想到的是不是利用js,其实利用纯CSS也能实现文字轮播与图片轮播,下面来看看实现方法,希望对大家有所帮助!

JavaScript对象的构造函数和new操作符(实例详解)JavaScript对象的构造函数和new操作符(实例详解)May 10, 2022 pm 06:16 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于对象的构造函数和new操作符,构造函数是所有对象的成员方法中,最早被调用的那个,下面一起来看一下吧,希望对大家有帮助。

JavaScript面向对象详细解析之属性描述符JavaScript面向对象详细解析之属性描述符May 27, 2022 pm 05:29 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于面向对象的相关问题,包括了属性描述符、数据描述符、存取描述符等等内容,下面一起来看一下,希望对大家有帮助。

javascript怎么移除元素点击事件javascript怎么移除元素点击事件Apr 11, 2022 pm 04:51 PM

方法:1、利用“点击元素对象.unbind("click");”方法,该方法可以移除被选元素的事件处理程序;2、利用“点击元素对象.off("click");”方法,该方法可以移除通过on()方法添加的事件处理程序。

foreach是es6里的吗foreach是es6里的吗May 05, 2022 pm 05:59 PM

foreach不是es6的方法。foreach是es3中一个遍历数组的方法,可以调用数组的每个元素,并将元素传给回调函数进行处理,语法“array.forEach(function(当前元素,索引,数组){...})”;该方法不处理空数组。

整理总结JavaScript常见的BOM操作整理总结JavaScript常见的BOM操作Jun 01, 2022 am 11:43 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于BOM操作的相关问题,包括了window对象的常见事件、JavaScript执行机制等等相关内容,下面一起来看一下,希望对大家有帮助。

See all articles

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
3 Il y a quelques semainesBy尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Version crackée d'EditPlus en chinois

Version crackée d'EditPlus en chinois

Petite taille, coloration syntaxique, ne prend pas en charge la fonction d'invite de code

Navigateur d'examen sécurisé

Navigateur d'examen sécurisé

Safe Exam Browser est un environnement de navigation sécurisé permettant de passer des examens en ligne en toute sécurité. Ce logiciel transforme n'importe quel ordinateur en poste de travail sécurisé. Il contrôle l'accès à n'importe quel utilitaire et empêche les étudiants d'utiliser des ressources non autorisées.

mPDF

mPDF

mPDF est une bibliothèque PHP qui peut générer des fichiers PDF à partir de HTML encodé en UTF-8. L'auteur original, Ian Back, a écrit mPDF pour générer des fichiers PDF « à la volée » depuis son site Web et gérer différentes langues. Il est plus lent et produit des fichiers plus volumineux lors de l'utilisation de polices Unicode que les scripts originaux comme HTML2FPDF, mais prend en charge les styles CSS, etc. et présente de nombreuses améliorations. Prend en charge presque toutes les langues, y compris RTL (arabe et hébreu) ​​et CJK (chinois, japonais et coréen). Prend en charge les éléments imbriqués au niveau du bloc (tels que P, DIV),

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

MantisBT

MantisBT

Mantis est un outil Web de suivi des défauts facile à déployer, conçu pour faciliter le suivi des défauts des produits. Cela nécessite PHP, MySQL et un serveur Web. Découvrez nos services de démonstration et d'hébergement.