通過標記通用實踐中的id屬性將值傳遞給javascript/JQuery？它安全嗎？

我發現自己做了很多，爲動畫目的的特定屬性，特別是當我使用通過PHP獲得的數據庫值生成的東西。有沒有理由不這樣做。通過標記通用實踐中的id屬性將值傳遞給javascript/JQuery？它安全嗎？

一些示例代碼，以清除歧義。

這將是JQuery的：

$('.class').each(function(){ 
    var my_new_width = $(this).attr('id'); 
      $(this).stop(false, true).animate({width: my_new_width}, 100); 
});

HTML是：

<img id='100' src='path'/>

顯然，這種代碼沒有提供的功能，並且是爲了與.hover()什麼用。只是想澄清問題中的含糊之處。

來源

2010-09-15 serv-bot 22

「id tags」？你能舉一個你的意思嗎？ – 2010-09-15 11:14:26

您錯誤地使用了單詞'標記' - 'id'是一個屬性。 HTML標籤的部分是：'' – Gareth 2010-09-15 11:19:13

我似乎記得html id屬性不能以數字開頭。 – 2010-09-15 11:46:29

根據W3C id's must begin with a letter，如果你不這樣做，我不會期待它爆炸。在HTML5中，您將在嘗試嵌入數據時使用前綴data-。

參見這太問題進行更多的討論和信息：Custom attributes - Yea or nay?

就個人而言，我更喜歡使用rel屬性...由於某種原因，感覺對我......即使它的錯誤，不符合W3C標準。

來源

2010-09-15 11:45:52

謝謝！我現在要切換到使用數據屬性。 :) – 2010-09-15 11:58:06

順便說一句。使用自定義數據屬性時是否存在兼容性問題？ – 2010-09-15 12:13:04

如果你的意思是我的意思，這是一個非常普遍的做法，你應該找到它相對安全，如果你包含一些示例代碼，這將有所幫助。

只要你的元素的id是唯一的，你不應該有一個同時訪問多個元素的問題。

Here are the jQuery docs on the Id selector.。基本上，語法是$("#elementId")。由於選擇符只是一個字符串文字，因此可以用這種方式注入元素的ID：$("#" + elementId)，其中此例中的elementId是一個變量。

不這樣做的唯一原因是當你發現自己反覆重複相同的jQuery的許多元素，其中腳本之間的唯一區別是Id傳遞。在這種情況下，您應該使用類選擇器：

從哪裏開始真正體驗jQuery的強大功能，就是當您開始使用選擇器語法選擇類時：$（「。className」）。這將返回一個「包裝集合」的元素，基本上是一個匹配元素的數組。

它允許您在單次調用中將beahviour綁定到多個元素。正是這個功能極大地減少了我大部分頁面上的腳本行數。

來源

2010-09-15 11:14:02

我認爲他並不是說你的想法......我想他說的是像在頁面上設置一個屬性的ID，比如，然後以某種方式獲得該元素jQuery代碼，並從中獲取ID（3），以用於其他操作。 – DaveyDaveDave 2010-09-15 11:30:38

誰可以告訴？不知道爲什麼有人低估了我。即使不是這個模糊問題的答案，我所說的也沒有錯。 – 2010-09-15 11:32:46

公平點：P - downvote刪除:) – DaveyDaveDave 2010-09-15 11:34:26

使用ID屬性作爲信息的佔位符是常見的做法，安全的，只要你注意一些原則：

ID必須是唯一
IDS不允許先從號碼

什麼是更有爭議的是使用自定義屬性的佔位符。使用jQuery很容易分配和檢索屬性的值。這將使您的代碼更易於閱讀和維護，但它會破壞HTML驗證。

來源

2010-09-15 11:28:02 kgiannakakis

如何使用自定義屬性？我可以創建一個屬性名稱並使用它嗎？ – 2010-09-15 11:33:37

建議您閱讀關於自定義屬性的這篇文章：http://ejohn.org/blog/html-5-data-attributes/實質上，在HTML 5之前，任何自定義屬性都將失敗HTML驗證。如果您以'data-'爲前綴定製屬性，HTML 5驗證將會通過。例如data-id =「value」 – 2010-09-15 11:36:29

謝謝daniel。這個評論很棒！正是我在找什麼。 – 2010-09-15 11:58:51

對我來說，這看起來非常不直觀，主要是因爲看起來你不太可能保證唯一性，但也因爲它不是一個ID的意思 - 這會讓別人閱讀你的代碼時感到困惑。

也許如果您發佈了一個更完整的示例，說明如何使用它，那麼人們可以更容易地推薦更好的方法。

來源

2010-09-15 11:37:17 DaveyDaveDave

我添加了一個非常簡短的例子。很顯然，ID必須是唯一的。這可以通過使用來自mysql的主鍵或唯一鍵作爲屬性來完成;或者手動確認.html文件。但說實話，我唯一一次看到自己需要這個技巧，就是當我用數學來確定新的CSS屬性應該是什麼時，或者當我鏈接到數據庫時。 – 2010-09-15 11:47:59

通過標記通用實踐中的id屬性將值傳遞給javascript/JQuery？它安全嗎？

回答

相關問題