2014-11-05 4 views
-2

는 커피 스크립트에서이 jQuery 코드의 상응하는 무엇입니까 기능 :커피 스크립트 돔는

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <script> 
     $(document).ready(function(){ 
      $("button").click(function(){ 
       alert($("#w3s").attr("href")); 
      }); 
     }); 
    </script> 
    </head> 
    <body> 
     <p><a href="http://www.google.com" id="w3s">Google.com</a></p> 
     <button>Show href Value</button> 
    </body> 
</html> 

PS : 나는 자바 스크립트의 어떤 종류의 커피 스크립트로 동작 할 수 있습니다 알고,하지만 난에 대한 커피 스크립트 구문을 배우고 싶다 이 코드. 는 코드의

+0

[js2coffee.org] (HTTP를 :

class window.ButtonAndLink constructor: (el)-> @$el = $(el) # optionally, cache the href # @href = @$el.find('a').attr('href') @addListeners() addListeners: -> @$el.find('button').on 'click', @handleClick handleClick: (e)=> alert @$el.find('a').attr('href') # optionally, use the cached value # alert @href $ -> $('.link-and-button').each (index, div)-> new window.ButtonAndLink(div) 

HTML이 약간 jsfiddle 작업

<div class="link-and-button"> <p><a href="http://www.w3schools.com" id="w3s">W3Schools.com</a></p> <button>Show href Value</button> </div> 

을 재 // js2coffee.org/) 당신을 도울 수 – Satpal

+0

빠른 응답을 주셔서 감사합니다,하지만 그것은 나에게 도움이되지 않습니다. 그것은 jQuery로 거의 동일한 코드를 제공합니다. – hayalet

+0

아마도 http://w3fools.com을 언급하기 위해 투표를하기 위해 투표를 할 것입니다. –

답변

0

엄격한 번역과 같을 것이다 ... 감사 :

$ -> 
    $("button").click (e)-> 
    alert $("#w3s").attr("href") 

을하지만, 나는 다음과 같은 백본 - 억양 스타일을 선호한다. 나는 div와 함께 pbutton 태그를 감싸서 컴포넌트로 관리 할 수 ​​있도록 HTML로 몇 가지 자유를 썼다. 분명한 이점은 재사용 할 수있는 개별 DOM 구성 요소의 추상화와 각 구성 요소마다 고유 한 컨텍스트가 있다는 것입니다. 때문에 커피 스크립트 클래스의 사용의 용이성, 그것은 매우 자연스러운한다 : http://jsfiddle.net/9bj2oj9t/

+0

11 줄의 (주관성 못생긴) 코드를 사용하여 2 줄로 할 수있는 동일한 작업을 수행 할 수 없다고 생각합니다. – Carpetsmoker

+1

@Carpetsmoker는 재사용 및 컨텍스트가 손실되었다는 것을 분명히 말합니다. 이는 동적으로 범위가 지정된 구성 요소를 만들기위한 템플릿 일뿐입니다. 그래도 downvote 고맙습니다. 싫어하는 사람은 싫어. –

+1

fwiw, 나는이 같은 추상화 때문에 한 줄의'document.ready' 함수가있는 여러 개의 10k 줄 자바 스크립트 응용 프로그램을 가지고 있습니다. –