Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: bmleunammf en 25 de Marzo 2017, 03:10
-
Hola soy nuevo y por mas que leo y leo no he podido entender del todo sobre javascript, solo manejo los conceptos muy basicos; por mas que leido y visto video no encuento la manera..
Soy usuario frecuente de google fotos (predecesor de picasa), cuando requiero publicar img por lotes en html el codigo que obtengo es el siguiente:
<a href="" ><img border="0" src="" /></a> <a href="" ><img border="0" src="" /></a> <a href="" ><img border="0" src="" /></a> <a href="" ><img border="0" src="" /></a>
En este punto solo nesecito el codigo correspondiente a las imagenes (desde el <img hasta el siguiente />), lo dema es vinculo y me toca borrarlo de uno por uno (aveces lo hago mas de 100 veces). Para logar el siguiente resultado:
<img border="0" src="" /> <img border="0" src="" /> <img border="0" src="" /> <img border="0" src="" />
Solo requiro un "textarea" para incluir las url, un boton para ejecutar y poder obtener todos los codigos img de manera mas practica.
Muchas gracias por su tiempo, pidiendo disculpas por las molestias y esperando pronta respuesta.
-
Hola bmleunammf.
Podrías probar con algo como esto:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<title>ejemplo</title>
<script type="text/javascript">
function limpiaTexto() {
var txt = document.getElementById('texto').value;
var resultado = document.getElementById('textoResuelto');
txt = txt.replace(/<a href="" >|<\/a>/g, '');
resultado.value = txt;
}
</script>
</head>
<body>
<textarea id="texto" rows="4" cols="50" placeholder="Inserta el texto aquí..."></textarea>
<button onclick="limpiaTexto();">Elimina texto sobrante</button>
<textarea id="textoResuelto" rows="4" cols="50"></textarea>
</body>
</html>
Saludos. ;D
-
Gracias por la respuesta, disculpa la tardanza.
el ejemplo que me das es practico pero no se ejecuta la siguiente seccion:
txt = txt.replace(/<a href="" >|<\/a>/g, '');
por algun motivo no se ejecuta, solo eimina al culminacion, si elimina el final del enlace.
Y en busca de alguna otra solucion para resolver tu ejemplo encontre una pagina que elimina lineas, asi que agregro el salto de linea al final del <a href="" > y elimino la linea. es mas engorroso pero al menos es otra solucion.
Ahora tengo otro problema que es mas practico, cuando obtengo las lineas no estan organizadas.
por ejemplo:
<img border="0" src="0001.webp" />
<img border="0" src="0011.webp" />
<img border="0" src="1005.webp" />
<img border="0" src="0075.webp" />
<img border="0" src="0030.webp" />
como organizaria las lineas en orden de menor a mayor. Como no se de progamacion pero si de un poco de logica, la custion seria:
- Que la busqueda se inicie desde el final de la linea asia el primcipio de la linea
- Que empise a ordenar desde el final hasta la posicion 13, que corresponde a la seccion "XXXX.webp" />".
- Una ves establecido en la seccion "XXXX.webp" />" evitaria que el resto de la linea causara problemas ya que incluten caracteres en orden aleatorios y desde la posicion 13 es la unica seccion que establece el orden que importa.
Ya que en todos los ejemplos que he encontrado ordenan comienzan a ordenar desde el inicio de la cadena y solo nombre o cadenas de una solo palabra, pero no lineas,
-
Este trabajo no es totalmente mio. Solo tome la informacion que en diversos sitios online y la ordene un poco, todavia tiene mucho codigo que no hace ninguna funcion ya que originalmente era para otro fin. Si puden solo limpien el codigo y dejen solo lo necesario.
El resultado es la <img> sin <a> y ordenadas alfabeticamente.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Removedor de Lines y ordenar alfabeticamente</title>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<script>
function buscar()
{
// Obtenemos el valor de la cadena a buscar
var cadena="<img";
var cadena2="</a>";
// Obtenemos el valor del textarea donde reemplazar el texto
var textarea=document.getElementById("input_output").value;
// Creamos una nueva expresion regular en la que especificamos
// la cadena a buscar con los parametros gi
// g=(global search) Busca en todo el texto
// i=(Case-insensitive) No diferencia de mayusculas y minusculas
var re=new RegExp(cadena,"gi");
var re2=new RegExp(cadena2,"gi");
// obtenemos en un array todas las coincidencias
var coincidencias=textarea.match(re);
if(coincidencias)
{
document.getElementById("coincidencias").innerHTML="se han encontrado "+coincidencias.length+" coincidencias";
// Hacemos el reemplazo por un campo vacio, y lo mostramos en el
// div con id=resultado
document.getElementById("input_output").value=textarea.replace(re,'\n<img').replace(re2,'\n');
}else{
document.getElementById("coincidencias").innerHTML="NO se ha encontrado ninguna coincidencia";
}
}
// Remover linea con <a
String.prototype.escapechars =
function(){
var echar = this.split('');
for(x=0;x<echar.length;x++){
if(echar[x].search(/[\W]/) != -1) echar[x] = '\\' + echar[x]; else echar[x] = echar[x];}
echar = echar.join('');
return echar;}
function remcon(){
var text = document.getElementById('input_output').value;
var remstr = document.getElementById('to_remove').value.escapechars().replace(/\\<or\\>/g,'|');
if(remstr.match(/\\<and\\>/) != null){
remstr = remstr.split('\\<and\\>');
for(var x=0;x<remstr.length;x++){
remstr[x] = '(?=.*' + remstr[x] + ')';}
remstr = remstr.join('');}
var counttype = '';
text = text.replace(/\r/g,'');
text = text.split('\n');
var startlength = text.length;
var newarrcnt = 0;
var remarrcnt = 0;
var textout = new Array();
var removeditems = new Array();
if(document.getElementById('exmode').checked == false){
if(document.getElementById('case_sen').checked == false){
for(var x=0;x<startlength;x++){
if(text[x].toLowerCase().match(remstr.toLowerCase()) == null)
{textout[newarrcnt] = text[x]; newarrcnt++;} else {
if(document.getElementById('crl').checked == false) {textout[newarrcnt] = ''; newarrcnt++;}
if(document.getElementById('dremoved').checked == true) removeditems[remarrcnt] = text[x]; remarrcnt++;}}}
if(document.getElementById('case_sen').checked == true){
for(var x=0;x<startlength;x++){
if(text[x].match(remstr) == null)
{textout[newarrcnt] = text[x]; newarrcnt++;} else {
if(document.getElementById('').checked == true) removeditems[remarrcnt] = text[x]; remarrcnt++;}}}
} else {
if(document.getElementById('').checked == false){
for(var x=0;x<startlength;x++){
textout[x] = text[x];
if(text[x].toLowerCase().match(remstr.toLowerCase()) != null) {removeditems[remarrcnt] = text[x]; remarrcnt++;}}}
}
textout = textout.join('\n');
document.getElementById('input_output').value = textout;
removeditems = removeditems.join('\n');
document.getElementById('removed_box').value = removeditems;
var lrem = ' lines removed.';
//document.getElementById('removed').innerHTML = remarrcnt + lrem;
}
</script>
<script>
function linecnt2(){
var text = document.getElementById('input_output').value;
var textlength = text.length;
var lncnt = text.split('\n').length;
if(textlength > 0) document.getElementById('line_count').value = lncnt; else document.getElementById('line_count').value = '0';}
Array.prototype.clean =
function(remove_item){
var arr;
var len = this.length;
for(arr=0;arr<len;arr++){
if(this[arr] == remove_item){
this.splice(arr,1);arr--;}}
return this;}
function csdsort(){
var delimiter = "/";
var snum = "8";
function rsortci(a,b){
x = a.toString().toLowerCase();
y = b.toString().toLowerCase();
if(x < y) return -1;
if(x > y) return 1;
return 0;}
function dsortci(a,b){
x = a.toString().toLowerCase().split(delimiter).slice(snum).join(delimiter);
y = b.toString().toLowerCase().split(delimiter).slice(snum).join(delimiter);
if(x < y) return -1;
if(x > y) return 1;
return 0;}
var text = document.getElementById('input_output').value;
text = text.replace(/\r/g,'');
if(delimiter == '' && snum == '0') text = text.split('\n').sort(rsortci).clean('').join('\n'); else text = text.split('\n').sort(dsortci).clean('').join('\n');
document.getElementById('input_output').value = text;}
function SelectAll(id){
document.getElementById(id).focus();
document.getElementById(id).select();}
</script>
</head>
<body>
<div align="center">
<textarea id="input_output" style="width: 728; height: 309; margin-top: 3px" wrap="off" spellcheck="false" rows="1" cols="20" onclick="this.focus();this.select()">
<a href="https://3.bp.blogspot.com/-7K5_s3HD1Ys/WOrffq-81PI/AAAAAAADER4/6xXXUXC1oBEXfegpQGj1eRSSBVsfd_1mwCPcB/s1600/Ult-Ni9htm4re_001-0005.webp" imageanchor="1" ><img border="0" src="https://3.bp.blogspot.com/-7K5_s3HD1Ys/WOrffq-81PI/AAAAAAADER4/6xXXUXC1oBEXfegpQGj1eRSSBVsfd_1mwCPcB/s1600/Ult-Ni9htm4re_001-0005.webp" /></a><a href="https://3.bp.blogspot.com/-touoVCbfJ5M/WOrfWV_rWdI/AAAAAAADER4/LMLSlt-ONcY7vxXr--sC0sVWoBin8Ja2QCPcB/s1600/Ult-Ni9htm4re_001-0001.webp" imageanchor="1" ><img border="0" src="https://3.bp.blogspot.com/-touoVCbfJ5M/WOrfWV_rWdI/AAAAAAADER4/LMLSlt-ONcY7vxXr--sC0sVWoBin8Ja2QCPcB/s1600/Ult-Ni9htm4re_001-0001.webp" /></a><a href="https://1.bp.blogspot.com/-_57yb1IBIMs/WOrffhM12qI/AAAAAAADER4/H8ye2JkG4MQjzW87hz2QtTns-QebVI1sACPcB/s1600/Ult-Ni9htm4re_001-0002.webp" imageanchor="1" ><img border="0" src="https://1.bp.blogspot.com/-_57yb1IBIMs/WOrffhM12qI/AAAAAAADER4/H8ye2JkG4MQjzW87hz2QtTns-QebVI1sACPcB/s1600/Ult-Ni9htm4re_001-0002.webp" /></a><a href="https://4.bp.blogspot.com/-1rCotjHXSi0/WOrffl6PgAI/AAAAAAADER4/L_iJ0mFKz8w5oP_7OzM6Cvolv2r6TLmsACPcB/s1600/Ult-Ni9htm4re_001-0003.webp" imageanchor="1" ><img border="0" src="https://4.bp.blogspot.com/-1rCotjHXSi0/WOrffl6PgAI/AAAAAAADER4/L_iJ0mFKz8w5oP_7OzM6Cvolv2r6TLmsACPcB/s1600/Ult-Ni9htm4re_001-0003.webp" /></a><a href="https://1.bp.blogspot.com/-t3EX6Pj4gQM/WOrffvwKVPI/AAAAAAADER4/lacnH9etQ5wJ3W1rfTBsGvBDH299Z1JBACPcB/s1600/Ult-Ni9htm4re_001-0004.webp" imageanchor="1" ><img border="0" src="https://1.bp.blogspot.com/-t3EX6Pj4gQM/WOrffvwKVPI/AAAAAAADER4/lacnH9etQ5wJ3W1rfTBsGvBDH299Z1JBACPcB/s1600/Ult-Ni9htm4re_001-0004.webp" /></a><a href="https://1.bp.blogspot.com/-iVI9hPsMuQg/WOrfflkQdUI/AAAAAAADER4/z74MAZ1YW3obPsbOFUqqb0uwvGxeH9YFwCPcB/s1600/Ult-Ni9htm4re_001-0006.webp" imageanchor="1" ><img border="0" src="https://1.bp.blogspot.com/-iVI9hPsMuQg/WOrfflkQdUI/AAAAAAADER4/z74MAZ1YW3obPsbOFUqqb0uwvGxeH9YFwCPcB/s1600/Ult-Ni9htm4re_001-0006.webp" /></a>
</textarea><div id="coincidencias"></div>
<br>
<input type="button" class="buttn" value="Dividir lineas" onClick="buscar();remcon();csdsort(); linecnt();" /> <br>
Para copiar el texto, seleccionelo y presione las teclas: [Contro] [C]
<textarea id="removed_box" rows="6" style="display: none; width: 716; height: 136; margin-top: 3px" wrap="off" spellcheck="false" cols="20">
Removed Line Box - Removed/extracted lines will display here.</textarea>
</div>
<div style="display:none;">
<input type="text" id="to_remove" value="<a" />
<input type="checkbox" id="case_sen" />
<input type="checkbox" id="crl" CHECKED />Colapsar lineas removidas.
<input type="checkbox" id="dremoved" onClick="if(document.getElementById('exmode').checked==false) {if(this.checked==true) document.getElementById('removed_box').style.display='block'; else document.getElementById('removed_box').style.display='none';} ;" />Mostrar
lineas removidas.
<input type="checkbox" id="exmode" onClick="if(this.checked==true) {document.getElementById('removed_box').style.display='block'; document.getElementById('dremoved').checked=false;} else {document.getElementById('removed_box').style.display='none'; document.getElementById('dremoved').checked=false;} " />Modo
de extacción.
</div>
</body>
</html>