Question

I want to use jQuery to determine if a link is a text link or an image link. If it’s a text link, I want to grab the text. If it’s an image link, I want to get the id of the image. I tried using .text() for the text links, but this also returns true for my image links.

function get_link_content(object) {

            if($(object).text()) {
                var link_content = $(object).text();
            }
// even if it's an image link, this ^^ always returns true
            else if($(object).find('img')) {
                if($(object).find('img').attr('id')) {
                    var link_content = $(object).find('img').attr('id');
                }
                else {
                    var link_content = 'unidentified';
                }
            }

            return link_content;
        }

By text link, I mean:

<a href="#">This is a text link</a>

By image link, I mean:

 <a href="#"><img id="the-id" src="#"></a>

Is there another method I should be using besides .text()?

Answer 1

Below is a cleaned up and slightly optimized version of your code:

function get_link_content(object) {
  var $object = $(object), // Cache the element for faster execution
      $img = $object.find('img'),
      link_content,
      id;

  if (!$img.length) { // Does the object element not have an image?
    link_content = $object.text();
  } else {
    id = $img.attr('id'); // Get the image ID (if it exist)

    if (id.length) { // Was there an ID?
      link_content = id;
    } else {
      link_content = 'unidentified';
    }
  }

  return link_content;
}

Edit: Here’s a further optimized version (with a jQuery element passed).

function get_link_content($object) {
  var $img = $object.find('img'),
      link_content;

  if (!$img.length) { // Does the object element not have an image?
    link_content = $object.text();
  } else {
    link_content = $img.attr('id'); // Get the image ID (if it exist)

    if (!link_content.length) { // Was there no ID?
      link_content = 'unidentified';
    }
  }

  return link_content;
}

As you can see, I’ve removed the id, since it’s to be stored in the link_content anyway (if the id existed and had a value). This means that it will be slightly faster when it encounters an image that has an id, since it doesn’t have to assign the id value to the variable id and then assign id to link_element in a second step if there was a value. It’s also a bit shorter than the first version, which increases readability a little bit.