적용 합자 와 링크를 텍스트만을 링크되지 않 href

Question

내가 사용하고 ligatures.js 대체 텍스트 안에는 나이트와 합자의 일부는 문자의 조합.예를 들어,'fi'에'오'.

여기에 내가 예제: http://jsfiddle.net/vinmassaro/GquVy/

당신이 그것을 실행할 때,선택할 수 있는 출력한 텍스트 보다는'fi'에'오'하나가되고있다 문자는 것입니다.는 경우에 당신은 링크를 복사하면,당신은 그것을 볼 수 있는 href 부분 대체되었습니다뿐만 아니라:

/news/here-is-a-url-with-%EF%AC%81ve-ligature

이것은 의도하지 않고 휴식의 링크입니다.할 수 있는 방법을 보충에만의 텍스트 링크를 하지 않 href 부분이 있는가?했는데 사용합니다.텍스트()하고 있습니다.지()함께 있습니다.미리 감사드립니다.

Answer 1

적절한 jQuery 선택기를 사용하여 해결할 수 있다고 생각합니다

$('h3 a, h3:not(:has(a))')
  .ligature('ffi', 'ffi')
  .ligature('ffl', 'ffl')
  .ligature('ff', 'ff')
  .ligature('fi', 'fi')
  .ligature('fl', 'fl');

.

http://jsfiddle.net/gquvy/7//a>

Answer 2

당신이 함수를 적용하는 전체 제목의 innerHTML, 을 포함하는 앵커의 href 특성이 있습니다.이 일에 대한 바이올린 예제:

$('h1 a, h2 a, h3 a, h4 a').ligature( //...

그러나,그것은에서 작동합니다 내부 링크 제목,그리고 나는 확실하지 않는 당신이 무엇을 찾고 있습니다.당신이 원하는 무언가를 위해 일하는 모 콘텐츠 안에 특정 요소( 모 레벨 태그의 둥지),그 다음 당신은 필요한 재귀적 접근 방법이다.여기에는 아이디어는 기본적으로 일반 자바 스크립트로부터 jQuery 방법을 제공하지 않습을 목표 DOM 텍스트 노드:

$.fn.ligature = function(str, lig) {
    return this.each(function() {
        recursiveLigatures(this, lig);
    });

    function recursiveLigatures(el, lig) {
        if(el.childNodes.length) {
            for(var i=0, len=el.childNodes.length; i<len; i++) {
                if(el.childNodes[i].childNodes.length > 0) {
                    recursiveLigatures(el.childNodes[i], lig);
                } else {
                    el.childNodes[i].nodeValue = htmlDecode(el.childNodes[i].nodeValue.replace(new RegExp(str, 'g'), lig));
                }
            }
        } else {
            el.nodeValue = htmlDecode(el.nodeValue.replace(new RegExp(str, 'g'), lig));
        }
    }

    // http://stackoverflow.com/a/1912522/825789
    function htmlDecode(input){
      var e = document.createElement('div');
      e.innerHTML = input;
      return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
    }
};

// call this from the document.ready handler
$(function(){
    $('h3').ligature('ffi', '&#xfb03;')
           .ligature('ffl', '&#xfb04;')
           .ligature('ff', '&#xfb00;')
           .ligature('fi', '&#xfb01;')
           .ligature('fl', '&#xfb02;');
});

해야 하는 작업 내용을 다음과 같다:

<h3>
    mixed ffi content 
    <span>this is another tag ffi <span>(and this is nested ffi</span></span>
    <a href="/news/here-is-a-url-with-ffi-ligature">Here is a ffi ligature</a>
</h3>

http://jsfiddle.net/JjLZR/