问题描述:

HTML:

<a href="/u"><span>Text</span></a>

<a href="/u"><span><strong>Text</strong></span></a>

<a href="/u"><span><strong>Text</strong></span></a>

<a href="/u"><span>Text</span></a>

var strong = $('span strong'),

notstrong= $('span'),

a = $('a[href^="/u"]');

for(var i=0;i<a.length;i++){

var checkIt = strong ? strong : notstrong;

$(a[i]).find(checkIt).before('<span>Hello</span>');

}

OutCome Should Be :

<a href="/u"><span><span>Hello</span>Text</span></a>

<a href="/u"><span><span>Hello</span><strong>Text</strong></span></a>

<a href="/u"><span><span>Hello</span><strong>Text</strong></span></a>

<a href="/u"><span><span>Hello</span>Text</span></a>

Actual OutCome:

<a href="/u"><span>Text</span></a>

<a href="/u"><span><span>Hello</span><strong>Text</strong></span></a>

<a href="/u"><span><span>Hello</span><strong>Text</strong></span></a>

<a href="/u"><span>Text</span></a>

For some reason the conditional operator is not returning my false statement. That or the coding is wrong, as in I am using the wrong selector before. Is that true? I am curious on why my conditional operator is incorrect. I'm new at conditional operators so maybe it is always returning true or I'm not exactly sure.

网友答案:

I don't quite know the end game, but if you're looking to determine whether or not something is strong in the context of the html block you have to give it more granular context. By just checking to see if $('span strong') exists it will always return true. Even if you do $('span strong').length that will always return true because it is moving across the entire block.

Here's an example where the strong is check per line not per the entire block. so in this case it only return true when that line has a strong inside of it.

for(var i=0;i<a.length;i++){
  var checkIt = $(a[i]).find(strong).length ? strong : notstrong;
  $(a[i]).find(checkIt).before('<span>Hello</span>');
}

http://jsfiddle.net/S8XP4/

网友答案:

If your problem isn't any more complicated than your code suggests, you could just do this:

$('a[href="/u"] > span').prepend('<span>Hello</span>');
网友答案:

$('span strong') returns a JavaScript object. JavaScript objects always equate to true because they are not undefined. What you want instead is the length property of said object.

var checkIt = strong.length ? strong : notstrong;

Edit: This still won't do what you want it to do, the logic error is deeper than this.

To accomplish the goal you presented, you can simply do this:

$('a[href^="/u"] strong').before('<span>Hello</span>');
网友答案:

In order to get the span to remain nested inside of it's original span when it finds a strong tag, you will have to change the method from before to prepend.

$('a[href^="/u"]').each(function(){
    if($(this).find('span strong').length > 0){
        $(this).find('span strong').before('<span>Hello</span>');
        return false;
    }
    $(this).find('span').prepend('<span>Hello</span>')
}); 

If you do not prepend you will end up with a result of

<a href="/u">
   <span>Hello</span>
   <span>Text</span>
</a>

Instead of

<a href="/u">
   <span>
      <span>Hello</span>
      "Text"
   </span>
</a>
相关阅读:
Top