Testing for file types in href. 1

[blackhawkdoc64]

I have been trying to learn javascript and was wandering if there is a way to test the href of an anchor to see if it is a .txt, .jpg ect. so that different file types taken from lets say a list of anchors could be handled in a different manner. Any ideas?

 

[dwarfthrower]

You can access the href property of the anchor and see what comes after the dot.

<a href="/somepath/somefile.jpg" onclick="javascript:alert('This is a ' + this.href.slice(this.href.lastIndexOf('.'), this.href.length) + ' file.')">Click Me</a>

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}
Enable Apps

 

[blackhawkdoc64]

Thank you. So to make sure I understand ... basicaly using the lastIndexOf function to return the start value for the slice which will enable me to make a new variable out of just the file type. Then I can use an if statement in the loop to compare the file types. Beautiful and thanks again.

 

[dwarfthrower]

Yep, although you might want to consider a switch statement rather than many if statements if you think you'll run into a number of file types.

String.indexOf and String.lastIndexOf are useful methods. indexOf will give you the position of the first encountered substring, while lastIndexOf will give you the last encountered substring's starting location. Think of a string as an array of characters and it becomes easier to see what those functions are doing.

Of course the example above only works on what information it is provided with. With some languages it can be hard to actually tell what sort of information will be returned from say a .php link. Someone could be using php to return HTML, or XML, or an image. So if it's vital that you know exactly what sort of content you're dealing with then using an XMLHttpRequest object to fetch the resource and checking the content-type returned might be a better bet.

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}
Enable Apps

 

[blackhawkdoc64]

I can definately see how the switch statement would be adventageous over the if statements in this instance and I agree that would be a better way. You have got my curiosity up about using the XMLHttpRequest object to check the content type though. As far as that object goes this is about all I know.

function getHTTPObject() {
  var xhr = false;
  if (window.[COLOR=red]XMLHttpRequest[/color]) {
    xhr = new [COLOR=red]XMLHttpRequest[/color]();
  } else if (window.ActiveXObject) {
    try {
      xhr = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
      } catch(e) {
        xhr = false;
      }
    }
  }
  return xhr;
}

function grabFile(file) {
  var request = getHTTPObject();
  if (request) {
    request.onreadystatechange = function() {
      displayResponse(request);
    };
    request.open("GET", file, true);
    request.send(null);
  }
}

function displayResponse(request) {
  if (request.readyState == 4) {
    if (request.status == 200 || request.status == 304) {
// execute some function here.
    }
  }
}

 

[dwarfthrower]

function displayResponse(request) {
  if (request.readyState == 4) {
    if (request.status == 200 || request.status == 304) {
     alert("Content-Type: " + request.getResponseHeader("Content-Type"));
    }
  }
}

Which will return: [tt]image/gif[/tt], [tt]text/html[/tt], [tt]audio/mpeg[/tt], [tt]image/png[/tt] or [tt]text/xml[/tt] depending on the type of resource the XMLHttpRequest encountered at the URL provided to it.

You can find out more about content-types here:

http://en.wikipedia.org/wiki/Internet_media_type

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}
Enable Apps

 

[blackhawkdoc64]

So from what I already knew it is as easy as get the header and look at the content-type. Very nice. I think with this info I will now be able to finish working on this idea of mine and it will be much cleaner and simpler, so I am off to try it all out. Thank you very much.