嵌入同一web插件具有不同數據屬性多次值

我想創建網頁插件，可以是的同一頁上，但不同的數據屬性值嵌入多次因此可以顯示根據不同的數據到數據屬性值。嵌入同一web插件具有不同數據屬性多次值

例如，我要嵌入mywidget.js文件多次如下：

<body> <div> <script src="script/mywidget.js" data-sport="soccer" id="widget-soccer"> </script> </div> <div> <script src="script/mywidget.js" data-sport="tennis" id="widget-tennis"> </script> </div> </body>

我的問題是，在mywidget.js裏面的代碼，我該如何確定正確的腳本標籤的參考和閱讀它是數據屬性，所以我可以使用該值從Web服務中獲取相應的數據。我只使用jQuery和JavaScript。

我希望小部件也可以嵌入到其他用戶網站，所以他們所做的只是使用腳本標記嵌入並傳入所需的數據屬性值，而無需在其網站上添加任何其他任何地方。

來源

2016-01-14 John Lee

-1

我不認爲你可以。我知道這是不是很好，但我會嘗試：

<div><script>sport = "soccer";</script><script src="script/mywidget.js" id="widget-soccer"></script></div> 

<div><script>sport = "tennis";</script><script src="script/mywidget.js" id="widget-tennis"></script></div>

，並利用體育在mywidget.js

另一種方法可能是myscript.js實際上是一個動態的「頁面」，讓我們用php說，那麼你可以使用SRC = 「腳本/ mywidget.js運動=游泳嗎？」，而在PHP，你會打印：

sport = "<?php echo addcslashes($_GET['sport'], '"'); ?>";

但更妙的是：

<script src="script/mywidget.js"></script>  
<div><script>showWidget("soccer");</script></div> 
<div><script>showWidget("basketball");</script></div>

來源

2016-01-14 01:23:12 Gavriel

-1

我想你可以使用jQuery找到SRC =「腳本/ mywidget.js」所有腳本標記，東西

$('script[src="script/mywidget.js"]')

然後你就會有腳本標籤的數組，你可以遍歷和訪問data屬性使用jQuery的.data()方法。

來源

2016-01-14 01:26:48

這不是一個非常好的方法，因爲它非常不靈活。但是，如果<script>標籤在不延期的情況下停止對文檔執行時的解析，那麼當前的腳本標籤將是DOM中的最後一個;這樣你就可以使用這個讓你的腳本中當前的運動：

var sport = $('script').last().data('sport');

然而，這將是更好的定義在外部JavaScript文件中的函數，然後當你需要實例化小部件調用它（編輯：就像李泰勒的回答）。

來源

2016-01-14 01:26:48 Amadan

你爲什麼不這樣做：

<head> 
    <script src="script/mywidget.js"></script> 
</head> 

<body> 
    <div><script>createMyWidget({sport : "soccer"});</div> 

    <div><script>createMyWidget({sport : "tennis"});</div> 
</body>

來源

2016-01-14 01:27:37

嵌入同一web插件具有不同數據屬性多次值

回答

相關問題