So erstellen Sie dynamisch Tags und legen Attribute mithilfe von js fest-js-Tutorial-php.cn

So erstellen Sie dynamisch Tags und legen Attribute mithilfe von js fest

php中世界最好的语言

Freigeben： 2018-03-17 13:44:57

Original

2592 Leute haben es durchsucht

Dieses Mal werde ich Ihnen die Methode zum dynamischen Erstellen von Tags und zum Festlegen von Attributen mit js vorstellen. Was sind die Vorsichtsmaßnahmen für das dynamische Erstellen von Tags und das Festlegen von Attributen mit js? Ein praktischer Fall. Stehen Sie auf und schauen Sie sich das an.

Wenn wir JSP-Seiten schreiben, stoßen wir häufig auf diese Situation: Die Anzahl der aus dem Hintergrund erhaltenen Daten ist ungewiss. Beim Schreiben von JSP-Seiten im Frontend sind wir uns derzeit nicht sicher, wie wir sie entwerfen sollen . Zu diesem Zeitpunkt müssen Sie Tags dynamisch über js erstellen:

1. Erstellen Sie ein Tag: Erstellen Sie ein Beispiel für p im Körper wie folgt; >

<script>
 function fun(){
 var framep = document.createElement("p");//创建一个标签
 var bodyFa = document.getElementById("bodyid");//通过id号获取framep 的父类（也就是上一级的节点）
 bodyFa .appendChild(framep);//把创建的节点framep 添加到父类body 中；
 }
<script>
<body id="bodyid" >
<!--在此添加p标签-->
</body>

Nach dem Login kopieren

2. Attribute hinzufügen: Fügen Sie dem erstellten Tag entsprechende Attribute hinzu:

framep .setAttribute("id", "pid");//给创建的p设置id值；
framep .className="pclass"; //给创建的p设置class；
//给某个标签添加显示的值；
var h = document.createElement("h1");
h.innerHTML = data[i].name;
var p = document.createElement("p");
p.innerHTML = "要显示的值";

Nach dem Login kopieren

3 Tag Ereignis hinzufügen:

a. Ohne Parameter:

framep.onmousedown = fun;//ps：函数名fun后面一定不能带括号，否则会在创建标签的时候执行函数， 而不是鼠标按下时执行；

Nach dem Login kopieren

c. Die aufzurufende Funktion

framep.onmousedown = function(){ fun(this); }

Nach dem Login kopieren

4. Sie können es ersetzen:

function fun(){ 
alert("鼠标按下");
}

Nach dem Login kopieren

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf PHP Chinesische Website! Empfohlene Lektüre:

 var pFlag = document.getElementById("pFlag");
 var pMain = document.createElement("p");
 if(pFlag != null){
 body.replaceChild(pMain, pFlag);//把原来的替换掉
}
pMain.setAttribute("id", "pFlag");

Nach dem Login kopieren

D3.js zeichnet einen dynamischen Fortschrittsbalken

ngrok+express debuggt die WeChat-Schnittstelle der lokalen Umgebung

Was tun, wenn dynamisch geladene Datenfolien immer fehlschlagen

Das obige ist der detaillierte Inhalt vonSo erstellen Sie dynamisch Tags und legen Attribute mithilfe von js fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!