Durch Erstellen von Tags in js Dynamics und Festlegen von Attributmethoden (ausführliches Tutorial)-js-Tutorial-php.cn

Durch Erstellen von Tags in js Dynamics und Festlegen von Attributmethoden (ausführliches Tutorial)

亚连

Freigeben： 2018-06-04 17:14:59

Original

3074 Leute haben es durchsucht

Im Folgenden werde ich einen Artikel über das dynamische Erstellen von Tags über js und das Festlegen von Attributen mit Ihnen teilen. Er hat einen guten Referenzwert und ich hoffe, dass er für alle hilfreich sein wird.

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:

a. Ohne Parameter:

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

Nach dem Login kopieren

b. Mit Parametern:

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

Nach dem Login kopieren

c. Die aufzurufende Funktion

rrree

4. Wenn Sie befürchten, dass das erstellte Tag nicht überschrieben wird, können Sie es ersetzen:

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

Nach dem Login kopieren

Das Obige habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

So fügen Sie Tag-Unterelemente in jQuery hinzu und weisen sie zu.

So ändern Sie den P-Tag-Text in jQuery Wert

So verwenden Sie Sass im Vue CLI Webpack (ausführliches Tutorial)

Das obige ist der detaillierte Inhalt vonDurch Erstellen von Tags in js Dynamics und Festlegen von Attributmethoden (ausführliches Tutorial). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!