Heim >Web-Frontend >HTML-Tutorial >HTML-Objekt: Einführung in einige Objekteigenschaften von HTML
HTML-Objekt: Einführung in einige Objekteigenschaften von HTML
- 不言Original
- 2018-08-09 15:16:442700Durchsuche
Der Inhalt dieses Artikels befasst sich mit HTML-Objekten: Eine Einführung in einige Objekteigenschaften von HTML. Ich hoffe, dass er für Freunde hilfreich ist.
Formularobjekt
Formularobjektmethode
reset(): Setzt alle Eingabeelemente des Formulars auf ihre Standardwerte zurück.
submit(): Formular abschicken.
Textobjekt
Textobjekteigenschaft
disabled: Legt fest oder gibt zurück, ob das Textfeld deaktiviert werden soll.
readOnly: Legt fest oder gibt zurück, ob das Textfeld schreibgeschützt sein soll.
Wert: Legen Sie den Wert des Wertattributs des Textfelds fest oder geben Sie ihn zurück.
Textobjektmethode
focus(): Fokus auf das Textfeld setzen.
Beispiel
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form>
<input name = "wd" />
<input type="submit" value="百度一下" onclick="sub()">
</form>
<script>
var form = document.getElementsByTagName("form")[0];
var text = document.getElementsByName("wd")[0];
text.focus();
function sub(){
var text = document.getElementsByName("wd")[0];
// text.value = "魔道";
// text.readOnly = "true";
// console.log(text.readOnly);
// text.disabled = "true";
console.log(text.disabled);
text.focus();
}
//type为text、password、textarea的标签均有value、focus、disabled、readOnly
</script>
</body>
</html>Funkobjekt
Funkobjekteigenschaft
geprüft: Legt den Status des Optionsfelds fest oder gibt ihn zurück.
deaktiviert: Legt fest oder gibt zurück, ob das Optionsfeld deaktiviert ist.
Wert: Legt den Wert des Wertattributs des Optionsfelds fest oder gibt ihn zurück.
Checkbox-Objekt
Checkbox-Objekteigenschaft
checked: Legt fest oder gibt zurück, ob das Kontrollkästchen aktiviert werden soll.
disabled : Legt fest oder gibt zurück, ob das Kontrollkästchen deaktiviert sein soll.
Wert: Legen Sie den Wert des Wertattributs des Kontrollkästchens fest oder geben Sie ihn zurück.
Objekt auswählen
Objektsammlung auswählen
Optionen []: Gibt ein Array zurück, das alle Optionen in der Dropdown-Liste enthält.
Objekteigenschaft auswählen
deaktiviert: Legt fest oder gibt zurück, ob die Dropdown-Liste deaktiviert werden soll.
Länge: Gibt die Anzahl der Optionen in der Dropdown-Liste zurück.
selectedIndex: Setzt die Indexnummer des ausgewählten Elements in der Dropdown-Liste oder gibt sie zurück.
Objektmethode auswählen
add(): Fügt eine Option zur Dropdown-Liste hinzu.
remove(): Eine Option aus der Dropdown-Liste entfernen.
Optionsobjekt
Optionsobjekt-Konstruktionsmethode
Option(text,value): Optionsobjekt erstellen
Option Objektattributausgewählt: Setzt den Wert des ausgewählten Attributs oder gibt ihn zurück. Text: Legt den Klartextwert einer Option fest oder gibt ihn zurück. Wert: Legen Sie den an den Server gesendeten Wert fest oder geben Sie ihn zurück.Beispiel für Objekt und Optionsobjekt auswählen
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<select id="grade">
<option value="1">一年级</option>
<option value="2">二年级</option>
<option value="3">三年级</option>
<option value="4">四年级</option>
</select>
<input type="button" onclick="text()" value="按钮" />
<script type="text/javascript">
function text(){
var select = document.getElementById("grade");
console.log(select.disabled);
console.log(select.length);
console.log(select.selectedIndex);
console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~`")
var options = select.options;
console.log(options[select.selectedIndex].value);
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);
}
var option = new Option("五年级","5");
select.add(option);
select.remove(0);
}
</script>
</body>
</html>
Registrierung
76c82f278ac045591c9159d381de2c57
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
a80eb7cbb6fff8b0ff70bae37074b813
b2386ffb911b14667cb8f0f91ea547a76e916e0f7d1e588d4f442bf645aedb2f
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
adaa35323c0e774c3401f5eeaad021b854bdf357c58b8a65c66d7c19c8e4d114ff9d32c555bb1d9133a29eb4371c1213
a3c38c5df3bd0ef801eff20f09d68ae6
f5d188ed2c074f8b944552db028f98a1
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c用户名：b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c66677a7cbdbf26f5b4be8dede2fe353db90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c密码：b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c9589aa3b033daf74e59b78a53d583ed9b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c确认密码：b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c6d13c2159bf38342899a7d768b94f482b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
f16b1740fad44fb09bfe928bcc527e08
3ea5dbfd399b8f71042a18725f567918男
ad881942639cffcc4579c376971b3fd0女
ff9d32c555bb1d9133a29eb4371c1213
d1e0b01b1506f8728873336b6865bf7a羽毛球
3e539ce442c5e67a6c62e8a5c36157f9篮球
ebae056c174c155368d696d5878bbb83乒乓球
a33e9cbdec54ff9234e2ba5d2597fa26足球
ff9d32c555bb1d9133a29eb4371c1213
f37074c1351f94297e4cf97b2ab2681e
859be17dfcd6af2d26185135fb5bd8fc大一4afa15d3069109ac30911f04c56f3338
656b9f2e82088a1bf3f244445950414e大二4afa15d3069109ac30911f04c56f3338
9403fa44e4282955565dbaeb33a85ca2大三4afa15d3069109ac30911f04c56f3338
0df899068b02ff57e98d12c8174c0b32大四4afa15d3069109ac30911f04c56f3338
18bb6ffaf0152bbe49cd8a3620346341
ff9d32c555bb1d9133a29eb4371c1213
b6c5a531a458a2e790c1fd6421739d1c3f1a3b04c1bd97ce66681e2e90414dc0b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1cc3086de9e33a2a167c44c4932c789135b90dd5946f0946207856a8a37f441edf
f5a47148e367a6035fd7a2faa965022e
3f1c4e4b6b16bbbd69b2ee476dc4f83a
//使用$()函数可节省代码量
function $(id){
return document.getElementById(id);
}
function check(){
var n = document.getElementById("name");
var w = document.getElementById("pw");
var msg = document.getElementById("wrong-massage");
var c = document.getElementById("pw-check");
if(n.value.length>12){
msg.innerHTML = "用户名不能超过15个字符，请重新输入！";
n.focus();
return false;
}
if(n.value.length==0){
msg.innerHTML = "用户名不能为空，请重新输入！";
n.focus();
return false;
}
if(w.value.length>12){
msg.innerHTML = "密码不能超过12个字符，请重新输入！";
w.focus();
return false;
}
if(w.value.length==0){
msg.innerHTML = "密码不能为空，请重新输入！";
w.focus();
return false;
}
if(w.value!=c.value){
msg.innerHTML = "密码错误，请重新输入！";
c.focus();
return false;
}
var sex = document.getElementsByName("sex");
var hobby = document.getElementsByName("hobby");
for(var i=0;i515c4b6db14d7592195e587d6086cf6312){
msg.innerHTML = "用户名不能超过15个字符，请重新输入！";
n.value = "";
n.focus();
}
else if(n.value.length==0){
msg.innerHTML = "用户名不能为空，请重新输入！";
n.focus();
}
else{
msg.innerHTML = " ";
}
}
function check_pw(){
var w = document.getElementById("pw");
var msg = document.getElementById("wrong-massage");
if(w.value.length>12){
msg.innerHTML = "密码不能超过12个字符，请重新输入！";
w.value = "";
w.focus();
}
else if(w.value.length==0){
msg.innerHTML = "密码不匹配，请重新输入！";
w.focus();
}
else
{
msg.innerHTML = " ";
}
}
2cacc6d41bbb37262a98f745aa00fbf0
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
Bildobjekt
Bildobjektattributsrc: Legt die URL des Bildes fest oder gibt sie zurück. Verwandte Empfehlungen:Das obige ist der detaillierte Inhalt vonHTML-Objekt: Einführung in einige Objekteigenschaften von HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!