Maison > interface Web > js tutoriel > En créant des balises dans js Dynamics et en définissant les méthodes d'attributs (tutoriel détaillé)

En créant des balises dans js Dynamics et en définissant les méthodes d'attributs (tutoriel détaillé)

亚连
Libérer: 2018-06-04 17:14:59
original
3090 Les gens l'ont consulté

Ci-dessous, je partagerai avec vous un article sur la création dynamique de balises via js et la définition d'attributs. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

Lorsque nous écrivons des pages jsp, nous rencontrons souvent cette situation : le nombre de données obtenues en arrière-plan est incertain. À l'heure actuelle, lors de l'écriture de pages jsp sur le front-end, nous ne savons pas comment les concevoir. . À ce stade, vous devez créer dynamiquement des balises via js :

1 Créez une balise : créez un exemple de p dans le corps comme suit ; >

<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>
Copier après la connexion
2. Ajouter des attributs : Ajoutez les attributs correspondants à la balise créée :

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 = "要显示的值";
Copier après la connexion
3. tag Ajouter un événement :

a. Sans paramètres :

b.
framep.onmousedown = fun;//ps:函数名fun后面一定不能带括号,否则会在创建标签的时候执行函数, 而不是鼠标按下时执行;
Copier après la connexion

c. La fonction à appeler

framep.onmousedown = function(){ fun(this); }
Copier après la connexion

4. Si vous craignez que la balise créée ne soit pas écrasée, vous pouvez le remplacer :

function fun(){ 
alert("鼠标按下");
}
Copier après la connexion

Ce qui précède est ce que j'ai compilé pour vous. J'espère que cela vous sera utile à l'avenir. Articles connexes :

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

Comment ajouter et attribuer des sous-éléments de balise dans jQuery

Comment modifier le texte de la balise P dans jQuery Valeur

Comment utiliser sass dans vue cli webpack (tutoriel détaillé)

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal