SVG <script>元素：內部還是外部？

我看到<script>標籤可以在svg標籤中使用（ref）。此外，svg標籤內的元素可以通過標籤外的JavaScript訪問，因爲它們是DOM的一部分。我找不到更好的細節。通常，我將所有JS代碼保存在單獨的文件中，並將引用包含在html中。我是否也可以使用針對svg元素的腳本。另外，我讀了我也可以給svg標籤內的一個外部JS文件的鏈接。SVG <script>元素：內部還是外部？

要更清楚一點，說我有一個網頁（html5）嵌入svg標籤在其中。 svg包含幾個基本形狀，我需要鼠標交互。我可能會使用jQuery，但不能使用其他外部插件。你會建議將所有的JavaScript（用於svg以外的元素）保存在一個單獨的文件中，還是將svg部分分開。也可以使用jQuery引用svg標籤中的元素嗎？我做任何低效

來源

2011-05-02 bsr

當您的腳本適合SVG本身時，在SVG內部放置一個<script>元素（無論您是使用內聯代碼還是通過xlink:href在另一個文件中引用）都是正確的，可以放置或不放置其他上下文。例如，如果您只有a scripted SVG document，這是必要的。

例如，假設您有一個HTML頁面，並且包含兩個SVG文件。

第一個SVG文件有一些通過JavaScript創建的自定義動畫。這個SVG文件應該直接擁有自己的腳本元素。
第二個SVG文件只是一個奇特的圖像，並且當您單擊該圖像時，您希望在HTML頁面上提交一個表單。爲此，該腳本應該在您的HTML頁面中，因爲它會同時與SVG和HTML表單進行對話。這是一個similar example，HTML中的按鈕用於控制SVG。

當你是inlining your SVG content in something XHTML5而不是引用外部SVG文件時，該行變得模糊。 SVG內容是它自己的野獸，還是它與特定段落文本一樣是HTML頁面的一部分？

我個人傾向於將我的SVG內聯到HTML中，從而將我的所有腳本保留在SVG之外。不過，要麼會奏效。

來源

2011-05-02 21:36:16 Phrogz

情景和思考過程的細分。很好的例子（雖然圓圈動畫引起我的血壓）！ – peteorpeter 2011-05-03 16:39:35

您可以使用屬性調用外部文件。

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"> 
    <script type="text/ecmascript" xlink:href="script.es"/> 
</svg>

（來源：W3C）

另外，我建議你RaphaelJS，一個JavaScript庫，允許跨瀏覽器的矢量繪圖。

來源

2011-05-02 21:35:40

謝謝..我的問題是關於將你的JS分離目標到SVG，還是與其他JS目標HTML元素結合和鏈接..還有，我需要任何特殊的照顧，同時解決SVG標籤中的元素或任何類似jQuery的庫都可以在svg中操作元素。我也看到了http://keith-wood.name/svg.html，但現在試圖使用最小的依賴關係。 – bsr 2011-05-02 21:39:52

我個人更喜歡將腳本與佈局分離，並使用單獨的文件。與通常的HTML DOM一樣，您可以使用** geElementById **和** getElementsByTagName **。 – 2011-05-05 05:07:34

SVG <script>元素：內部還是外部？

回答

相關問題