1

我想使用 jQuery 来确定链接是文本链接还是图像链接。如果是文本链接，我想抓取文本。如果是图片链接，我想获取图片的 id。我尝试将 .text() 用于文本链接，但这也为我的图像链接返回 true。

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;
        }

通过文本链接，我的意思是：

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

通过图片链接，我的意思是：

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

除了 .text() 之外，我还应该使用另一种方法吗？

4

5 回答 5

2 
if( $('img', $(object)).length ){
//object has a img as child
}
else{
//object doesnt have
}

或者

var myText = $('img', $(object)).length ? $('img', $(object)).attr('id') 
             : $(object).text();

或作为一个函数

function get_link_content(object) {
    return $('img', $(object)).length ? $('img', $(object)).attr('id') 
                 : $(object).text();
}

或者

return ( $('img', $(object)) && $('img', $(object)).attr('id') ) || $(object).text();

从@undefined 的建议将所有长度更改为 has() ，然后在阅读 'has()' 的文档后恢复为长度：P

于 2012-08-29T22:41:43.383 回答
1

您可以使用 jQuery 对象的length属性：

var $obj = $(object);
if(!$obj.children().length) {
    var link_content = $obj.text();
} else {
    var link_content = $('img', $obj).attr('id');
    // ...
}

请注意，您可以$(object)多次缓存而不是制作 jQuery 对象。

于 2012-08-29T22:41:05.913 回答
1 
function get_link_content(e) {
        if($(e).find('img').length != 0) {
            if($(e).find('img').attr('id')) {
                var link_content = $(e).find('img').attr('id');
            } else {
                var link_content = 'unidentified';
            }
        } else {
            var link_content = $(object).text();
        }
        return link_content;
    }

$(object).find('img')- 这将始终返回 jQuery 对象，并且对象始终为真。要检查 jQuery 是否找到了某些元素，您应该使用 length 属性。

顺便说一句： $(e).find('img').attr('id') - 多次这样做不是最好的方法。最好一次获取该值并将其放入某个临时变量中。

于 2012-08-29T22:41:35.227 回答
1 
function get_link_content(object) {
    var link_content = 'unidentified';
    var $img = $(object).find('img');
    if(!$img.length){
      //no image found
      //get the text
      var $txt = $(object).text();
      if($txt.length){
          link_content = $txt;
      }
    }else{
      //there's an image
      link_content = $img.attr('id');
    }
    return link_content;
}
于 2012-08-29T22:44:54.767 回答
1

以下是您的代码的清理和略微优化的版本：

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;
}

编辑：这是一个进一步优化的版本（通过了一个 jQuery 元素）。

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;
}

正如你所看到的，我已经删除了, 因为它无论如何id都要存储（如果存在并且有一个值）。这意味着当它遇到具有 的图像时它会稍微快一些，因为它不必将 id 值分配给变量，然后如果有值则在第二步中分配给。它也比第一个版本短一点，这增加了一点可读性。link_contentididididlink_element

于 2012-08-29T23:32:33.937 回答