在html中使用<style>和<script> ...是否真的很糟糕？

我真的認爲，如果我只用一個PHP函數調用就可以包含一個功能完整的組件，那對我的工作流程會有好處。類似於在html中使用<style>和<script> ...是否真的很糟糕？

ddl（）;

這將產生一個HTML下拉列表，完全樣式和功能。使用外部資源時，我需要考慮包含JavaScript和CSS以使其正常工作，但如果我只是將所有這些內容包含在ddl（）函數本身中，它會使事情變得更容易。

因此，像：

<?php 
 
function ddl(){ 
 
    <style> 
 
    .ddl{ 
 
      //style 
 
     } 
 
    </style> 
 
?> 
 
    <div class="ddl"> 
 
    <!-- my drop down list --> 
 
    </div> 
 
    
 
<script> 
 
    //Do ddl functionality 
 
</script> 
 
<?php 
 
}

什麼是真正的缺點，做事這樣？性能更差嗎？

來源

2017-06-01 Jordan Carter

那麼每次你決定使用該功能時，你都會複製CSS和JavaScript。 – Pointy

你真的應該考慮學習一個現代的JavaScript框架。 Vue的組件基本上就是這樣，除了明智的實現。 – ceejayoz

如果每頁僅使用一次或兩次，該怎麼辦？它會對其他網頁產生影響嗎？ –

對於小型項目 - 一到三頁 - 你可能永遠不會注意到很多問題。特別是如果你從不復制功能。但是，如果你想要一個可伸縮的應用程序，你真的需要將表單與函數分開。通過查看樣式間的關係，樣式表實際上更容易維護。與嵌入式腳本相比，JavaScript在更大的塊中管理得更好。

如果您以後決定擴展具有嵌入式樣式和JavaScript的應用程序，則需要處理將這些問題分離出來的問題 - 尤其是當您要重用功能時。如果您忘記從HTML中刪除樣式標籤，或者更糟 - 樣式屬性 - 它可能會覆蓋您的CSS文件更改，因此清理工作非常重要。

將JavaScript和CSS放在單獨的文件中也有緩存優勢。如果您的應用程序有重複的功能或樣式，則瀏覽器只需爲每個文件加載一次代碼。但是，如果您已將其嵌入到每個頁面中，則瀏覽器必須每次都重新加載所有內容。

爲了便於維護，代碼的清晰性和緩存速度，我投票時應始終將這些與HTML/PHP分開。

來源

2017-06-01 20:51:52 Paurian

更易於管理的高速緩存，這將減少帶寬使用
沒有重複代碼
更好的做法，可擴展性的目的 - 也許你有一個交互設計師，圖形設計師和軟件開發人員。你不希望每個人都在同一個文件上工作

來源

2017-06-01 21:00:26 Jesper

我現在看到@Paurian有一個更好的解釋，但也許這可以總結一點 – Jesper

我同意1和2，但對我而言，我不同意第3點，因爲它更清楚地看到一個文件中的所有內容。我也是負責該項目的唯一Web開發人員。有沒有辦法通過這種方法避免問題1和2？ –

在html中使用<style>和<script> ...是否真的很糟糕？

回答

相關問題