JavaScript - Insertar etiquetas HTML desde javascript

   
Vista:

Insertar etiquetas HTML desde javascript

Publicado por Carlos (3 intervenciones) el 22/04/2014 05:02:12
Hola tengo un pequeño problema quiero mostrar un mensaje de error al final de la pagina estaba haciendo pruebas un ejemplo es esto

/////HTML//////
1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="UTF-8" />
	<title>Documento sintulo</title>
	<script src="java.js" type="text/javascript"></script>
</head>
 
<body>
 
</body>
</html>
////////////////////////////////////
1
2
3
4
5
6
/////JavaScript///////
// JavaScript Document
var contenedor = document.createElement('div');
contenedor.innerText = 'Hola Mundo';
document.body.appendChild(contenedor);
/////////////////////////////////

en la parte del appendChild me da este error -- Uncaught TypeError: Cannot read property 'appendChild' of null

Ayuda es para mi proyecto escolar :D
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

Insertar etiquetas HTML desde javascript

Publicado por pablo pablo.fx200@gmail.com (1 intervención) el 22/04/2014 05:29:03
En el archivo js puedes usar algo así

1
2
3
4
5
6
window.onload = function ()
{
	var contenedor = document.createElement('div');
	document.body.appendChild(contenedor);
	contenedor.innerHTML = 'Hola Mundo';
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar

Insertar etiquetas HTML desde javascript

Publicado por Carlos (3 intervenciones) el 22/04/2014 05:50:51
si ya pude hacer eso pero en el proyecto en si ya no sale dejare ambos codigos no se porque funciona en uno y en otro no
//////////////////////////////HTML//////////////////////////////////////////////////////
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>P&iacute;nchis Love</title>
 
<link rel="stylesheet" type="text/css" href="../css/style1.css"  />
<link rel="shortcut icon" href="img/iconos/icono32.png"  />
<script type="text/javascript" src="../JS/Formularios.js"></script>
 
</head>
 
<body>
	<table align="center" width="800px">
		<tr>
			<td height="10" colspan="2">
				<p align="right" class="menureg"><font size="1">|<a href="log_in.html"> Log in</a>&nbsp;</font></p>
				<p align="right" class="menureg"><font size="1"><a href="sign_in.html">Sing in</a>&nbsp;</font></p>
			</td>
		</tr>
	</table>
	<table width="800px" border="1px" bgcolor="black" align="center" bordercolor="#FFCC00" height="1000px">
	<!--Aqui es la parte del banner-->
		<tr>
			<td colspan="2" height="100px">
				<img src="../img/baner.jpg" width="800px" height="100px" align="middle" />
			</td>
		</tr>
	<!-------------------------------->
	<!--Menu Principal---------------->
		<tr>
			<td width="160px">
				<ul id="lulmenu">
					<li>MENU</li>
				</ul>
				<ul class="lul">
					<li><a href="../index.html">Home</a></li>
					<li><a href="https://www.facebook.com/groups/544052145616979/" target="_blank">FB-Pnchis</a></li>
					<li><a href="http://www.youtube.com/" target="_blank">YouTube</a></li>
					<li><a href="#">link3</a></li>
					<li><a href="#">link4</a></li>
					<li><a href="#">link5</a></li>
				</ul>
			</td>
	<!-------------------------------->
	<!--Contenido----------------->
			<td width="640px">
			<h1 align="center">Sing In</h1>
      <p align="center">Ingresa a la comunidad (Ningun dato puede quedar en blanco)</p>
      <table width="400" id="signin" align="center">
      <form method="post">
      <tr>
	  	<td align="right">Nombre:</td>
      <td><input type="text" name="nombre" id="nombre"/></td>
      </tr>
      <tr>
	  	<td align="right">Apellido:</td>
      <td><input type="text" name="apellido" id="apellido"/></td>
      </tr>
      <tr>
      <td align="right">Nombre de Ususario:</td>
      <td><input type="text" name="usuario" id="user"></td>
      </tr>
      <tr>
	  	<td align="right">E-Mail:</td>
	  	<td><input type="text" name="email" id="mail"/></td>
	  </tr>
	  <tr>
	  	<td align="right">Fecha de Nacimiento:</td>
	  	<td>
	  	<select name="dia" id="dia">
		<option value="dia">Dia</option>
	  		<option value="01">01</option>
			<option value="01">02</option>
			<option value="01">03</option>
			<option value="01">04</option>
			<option value="01">05</option>
			<option value="01">06</option>
			<option value="01">07</option>
			<option value="01">08</option>
			<option value="01">09</option>
			<option value="01">10</option>
			<option value="01">11</option>
			<option value="01">12</option>
			<option value="01">13</option>
			<option value="01">14</option>
			<option value="01">15</option>
			<option value="01">16</option>
			<option value="01">17</option>
			<option value="01">18</option>
			<option value="01">19</option>
			<option value="01">20</option>
			<option value="01">21</option>
			<option value="01">22</option>
			<option value="01">23</option>
			<option value="01">24</option>
			<option value="01">25</option>
			<option value="01">26</option>
			<option value="01">27</option>
			<option value="01">28</option>
			<option value="01">29</option>
			<option value="01">30</option>
 
	  	</select>
		<select name="Mes" id="mes">
		<option value="Mes">Mes</option>
	  		<option value="01">01</option>
			<option value="01">02</option>
			<option value="01">03</option>
			<option value="01">04</option>
			<option value="01">05</option>
			<option value="01">06</option>
			<option value="01">07</option>
			<option value="01">08</option>
			<option value="01">09</option>
			<option value="01">10</option>
			<option value="01">11</option>
			<option value="01">12</option>
	  	</select>
			 <select name="Año" id="año">
			 <option value="Año">A&ntilde;o</option>
			<option value="01">2012</option>
			<option value="01">2011</option>
			<option value="01">2010</option>
			<option value="01">2009</option>
			<option value="01">2008</option>
			<option value="01">2007</option>
			<option value="01">2006</option>
			<option value="01">2005</option>
			<option value="01">2004</option>
			<option value="01">2003</option>
			<option value="01">2002</option>
			<option value="01">2001</option>
			<option value="01">2000</option>
			<option value="01">1999</option>
			<option value="01">1998</option>
			<option value="01">1997</option>
			<option value="01">1996</option>
			<option value="01">1995</option>
			<option value="01">1994</option>
			<option value="01">1993</option>
			<option value="01">1992</option>
			<option value="01">1991</option>
			<option value="01">1990</option>
 
	  	</select>
	  	</td>
	  </tr>
	  <tr>
	  	<td colspan="0" align="right">
		Sexo:
		</td>
		<td>
		<input type="radio" name="sexo" value="Hombre" id="h"/>Hombre<br/>
	  	<input type="radio" name="sexo" value="Mujer" id="m"/>Mujer
	  	</td>
	  </tr>
	  <tr>
		<td align="right">Contrase&ntilde;a:</td>
		<td><input type="password" id="pass"/></td>
	  </tr>
	  <tr>
		<td align="right">Repite tu Contrase&ntilde;a:</td>
		<td><input type="password" id="passR"/></td>
	  </tr>
	  <tr>
	  	<td colspan="2" align="center">
	  	<input type="submit" value="Ingresar" onclick="Signin()"/>
	  	<input type="reset" value="Limpiar" />
	  	</td>
	  </tr>
      </form>
      </table>
			</td>
		</tr>
		<tr>
			<td colspan="2" height="10px">
			<p></p>
			</td>
		</tr>
	</table>
 
</body>
 
</html>
//////////////////////////////////////////////////////////////////////////////////////////////////////////



//////////////JavaScript//////////////////////////////////////////////

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
function Signin(){
	alert("Entro");
	var nom = document.getElementById("nombre").value;
	var apell = document.getElementById("apellido").value;
	var user = document.getElementById("user".value);
	var email = document.getElementById("mail").value;
	var fD = document.getElementById("dia").value;
	var fM = document.getElementById("mes").value;
	var fA = document.getElementById("año").value;
	var sexo;
	var pass = document.getElementById("pass").value;
	var passR = document.getElementById("passR").value;
 
	if(document.getElementById("h").checked)
		sexo = document.getElementById("h").value;
	if(document.getElementById("m").checked)
		sexo = document.getElementById("m").value;
 
	if(nom==""){
		alert("El nombre no puede quedar en blanco...")
		var contenedor = document.createElement('div');
		contenedor.innerText = 'Hola Mundo';
		document.body.appendChild(contenedor);
	}
	/*if(apell=="")
	if(user=="")
	if(email=="")
	if(fD=="Dia")
	if(fM=="Mes")
	if(fA =="Año")
	if(sexo=="")
	if(pass=="")
	if(pass.length < 5)
	if(passR=="")
	if(passR != pass)*/
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar