데이터 매개 변수를 사용하여 jquery 코드를 HTML 5와 호환되도록 수정하십시오.

Question

jQuery 코드를 사용하여 스팬 클래스 내부의 모든 것을 가져 와서 대신 내 제휴사에 대한 링크를 배치합니다.) } }

내가 수정하는 방법;

// Function for rendering affiliate links in a way that won't pass PageRank. 
function affiliateLinks(){ 

// Declare local variables. 
    var theURL, theAnchorText, theTitle; 

// Declare the variable "spans" as the collection of all <span> elements. 
    var spans = document.getElementsByTagName('span'); 

// Perform the following steps for every <span> element. 
    for (var i = 0; i<spans.length; i++){ 

// If the <span> element is part of the "affiliate" class... 
     if (hasClass(spans[i], 'affiliate')){ 

// Use the content between the <span> tags as our affiliate link's anchor text. 
// Example: <span class="affiliate" title="Affiliate Site">this will be our anchor text</span> 
// The content doesn't have to be just text; it can be HTML too. 
// Example: <span class="affiliate" title="Affiliate Site"><img src="/banners/affiliate-logo.png" /></span> 
      theAnchorText = spans[i].innerHTML; 

// Get the value of the <span> element's title attribute, make it lowercase, and remove whitespace 
// characters from the beginning and end. 
      theTitle = spans[i].title; 

      campaign = spans[i].campaign; 

      theURL = 'http://www.test.com/dir/' + theTitle + '?psid=testcampaign_id=' + campaign + ''; 

// Insert the new affiliate link into its corresponding <span> element and copy the <span> element's 
// CSS classes (all of them) into the affiliate link's <a> tag. 
      spans[i].innerHTML = '<a href="' + theURL + '" target="_blank" class="' + spans[i].className + '">' + theAnchorText + '</a>'; 

// Remove the title attribute from the <span> element, to prevent Firefox from displaying it in a tooltip. 
      spans[i].removeAttribute('title'); 
     } 

감사합니다 : 이것은 JQuery와는

<span class="affiliate" title="mytitle" campaign="mycampaign">Join</span> 

:

이 스팬 클래스는 다음과 같습니다 여기에 코드입니다 내 jquery이 코드는 HTML 5를 사용하고 데이터 매개 변수를 사용하려는 경우. 나는 campaing과 title 대신 data-title과 data-campaign을 가질 것인가?

<span class="affiliate" data-title="mytitle" data-campaign="mycampaign">Join</span> 

내 JQuery와에이 일을 시도했지만 작동하지 않습니다

theTitle = spans[i].data-title; 

campaign = spans[i].data-campaign; 

당신에게

당신은 그런 속성 이름으로 data-title을 넣을 수 없습니다

Answer 1

사실 새로운 버전, 그래서 그냥 이렇게, 데이터 객체 (demo)에 모든 data- 속성을 저장 섹션

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 

그래서이 될 것이다 당신의 "jQuerified"코드 :

// Function for rendering affiliate links in a way that won't pass PageRank. 
function affiliateLinks(){ 

    // Declare local variables. 
    var theData, theSpan, theURL, theAnchorText, theTitle, theCampaign; 

    // Declare the variable "spans" as the collection of all <span> elements. 
    var spans = $('span.affiliate'); 

    // Perform the following steps for every <span> element. 
    for (var i = 0; i<spans.length; i++){ 
     theSpan = spans.eq(i); 
     theData = theSpan.data(); 

     // Use the content between the <span> tags as our affiliate link's anchor text. 
     // Example: <span class="affiliate" title="Affiliate Site">this will be our anchor text</span> 
     // The content doesn't have to be just text; it can be HTML too. 
     // Example: <span class="affiliate" title="Affiliate Site"><img src="/banners/affiliate-logo.png" /></span> 
     theAnchorText = theSpan.html(); 

     // Get the value of the <span> element's title attribute, make it lowercase, and remove whitespace 
     // characters from the beginning and end. 
     theTitle = $.trim(theData.title.toLowerCase()); 

     theCampaign = theData.campaign; 

     theURL = 'http://www.test.com/dir/' + theTitle + '?psid=testcampaign_id=' + theCampaign + ''; 

     // Insert the new affiliate link into its corresponding <span> element and copy the <span> element's 
     // CSS classes (all of them) into the affiliate link's <a> tag. 
     theSpan 
      .html('<a href="' + theURL + '" target="_blank" class="' + spans[i].className + '">' + theAnchorText + '</a>') 

      // Remove the title attribute from the <span> element, to prevent Firefox from displaying it in a tooltip. 
      .removeAttr('title'); 
    } 
} 

Answer 2

하이픈이 허용되지 않기 때문에 감사 . jQuery를 함께 할 수있는 가장 좋은 방법은 다음과 같습니다 당신이 jQuery를 최신 버전을 사용하는 경우 data- 속성을 사용합니다

theTitle = $(spans[i]).data('title'); 

.

var data = $('span:eq(' + i + ')').data(), 
    title = data.title, 
    campaign = data.campaign; 

---

업데이트 : : 페이지의 머리에이를 당신이 jQuery를 포함해야합니다 추가 확인 jQuery를의