在JavaScript中使用$

-5

我知道$在jQuery中有何用處。但是我想知道在下面的情況下$的行爲是什麼。

 var Page = { 

     init: function() { 

      **Page.element = $("content");** 
     } 
     }

我明白你可能會說這個引用是一個元素名稱的內容。但不是！其實我有一個DIV標籤這裏有

ID =「內容」

，這適用於它完全罰款..

而且有趣的是，如果我一個參考的jQuery添加爲在它下面不起作用。

<script type="text/javascript" charset="utf-8" src="js/jquery-1.4.2.js"></script>

我試圖用jQuery

這裏的幾個版本是頁面

<script type="text/javascript" charset="utf-8"> 


    var Page = { 

     init: function() { 

      Page.element = $("content"); 

      Page.photo = $("body-photo"); 
      Page.points = $("body-points"); 
      Page.panel = $("content-2"); 

      Page.content = $("content-1"); 
      Page.contentCloseBtn = $$("#content-1 .close-btn")[0]; 

      Page.zoomOutBtn = $$("#content-2 .zoom-out-btn")[0]; 


      Page.contentCloseBtn.addEventListener("click", bind(function() { 
       var state = hasClass(Page.content, "open"); 
       if (state) removeClass(Page.content, "open") 
       else addClass(Page.content, "open") 
      }, Page), false); 


      Page.attach(); 

     }, 

     attach: function() { 
      Page.points.addEventListener("click", function() { Page.zoomIn.call(); alert('ccc'); }, false); 
     }, 

     zoomIn: function() { 
      Page.points.removeEventListener("click", Page.boundZoomIn, false); 
      Page.photo.addEventListener("webkitTransitionEnd", Page.zoomInEnd, false); 

      addClass(Page.element, "zoom-in"); 

     }, 

     zoomInEnd: function() { 
      Page.photo.removeEventListener("webkitTransitionEnd", Page.zoomInEnd, false); 
      Page.zoomOutBtn.addEventListener("click", Page.zoomOut, false); 

      addClass(Page.element, "zoom-in-end"); 
      addClass(Page.panel, "expanded"); 
     }, 

     zoomOut: function() { 
      Page.zoomOutBtn.removeEventListener("click", Page.zoomOut, false); 

      removeClass(Page.panel, "expanded") 
      removeClass(Page.element, "zoom-in-end"); 
      removeClass(Page.element, "zoom-in"); 
     } 
    }; 

    window.addEventListener("DOMContentLoaded", bind(Page.init, Page), false); 
    function startAnimation() { 
     Page.init.call(Page); 
    } 

    startAnimation(); 


</script>

我希望它與參考的jQuery怎麼把這個文件是工作在整個的javascript正在被導入到另一個網頁，並要求jQuery參考

這裏我s的HTML

<body class="slide-7"> 
<div id="content" > 
    <header> 
     <h1>xxxx</h1> 
     <h2>xxxx.</h2> 
    </header> 

    <div id="body-photo"> 
     <img src="xxxx.jpg" style="height: 100%; width: 100%;" /> 
     <ul id="body-points" class="hotspot-list"> 
      <li class="hotspot-1"></li> 
      <li class="hotspot-2"> 
       <div class="tooltip"> 
        xxxx 
        <div class="tooltip-corner"></div> 
       </div>     
      </li> 
      <li class="hotspot-3"></li> 
      <li class="hotspot-4"></li> 
     </ul>   
    </div> 


    <section id="content-1"> 
     <article> 
      <header>xxxx.</header>  
      <p>xxxx.</p> 
      <p>xxxx.</p> 
     </article> 
     <div class="close-btn"></div> 
    </section> 


    <section id="content-2"> 
     <article> 
      <figure><img src="xxxx.jpg" alt="" /></figure>     
      <hgroup> 
       <h1>xxxx</h1> 
       <h2>xxxx.</h2> 
      </hgroup> 
      <div class="copy"> 
       xxxx    
      </div> 

     </article> 
     <div class="article-icons"> 
      <img class="active zoom-out-btn" src="xxxx.png" alt="" /> 
      <img src="xxxx.png" alt="" /> 
     </div> 
     <!-- <div class="maximize-btn"></div> --> 
    </section> 





</div> 
</body>

任何與此senario有關的鏈接也將不勝感激。謝謝:)

來源

2013-06-19 Amily Bennet

你絕對已經包含了一個腳本，它使用$來通過它的id來選擇元素。 – jolt

@Zenith在* jQuery *碰巧使用的慣例中......！ – deceze

根據jQuery的約定id選擇器應該有＃...但在這裏它並沒有，如果我添加一個引用jquery比這個代碼不工作，因爲我在問題中提到... –

最有可能的是，該片段建立在Prototype上。這是另一個JavaScript庫，如jQuery，它也使用$作爲簡寫，但它的工作方式不同。

在原型中，$使用ID進行選擇，而$$使用CSS選擇器進行選擇。另一方面，jQuery僅導出$速記以使用CSS選擇器進行選擇，這與Prototype中的用法不同。通過包含jQuery（無noConflict模式），$調用中斷，因爲它們現在由jQuery處理。

來源

2013-06-19 12:35:39

\ *可能。但可能。 – deceze

是的..有原型庫...我通過使原型庫使用另一個符號而不是$ ...來消除衝突。那很簡單！謝謝:) –

$符號在純Javascript中沒有任何特殊含義。實際上，這就是jQuery能夠使用它的原因，並且創建了與$符號混淆的jQuery函數。

所以你的腳本做同樣的事情。好消息是，jQuery允許你使用他們所說的「不衝突模式」。看到這個其他問題：What is jquery noconflict, why do we need that?

也就是說，你可能會更好的重寫更小的腳本來使用jQuery。它看起來像一個非常簡單的腳本，並沒有太多的改變。你可以從練習中受益..

來源

2013-06-19 12:35:43

我們可以使用我們自己的別名jQuery的權利？ – Praveen

是的，你可以創建你自己的別名。 –

在JavaScript中使用$

回答

相關問題