為什麼現在很多網站都不用原生的input輸入，而是用div模擬？

01-04

1.為什麼不直接用一個原生的input輸入框，而是用div模擬輸入值，模擬默認字？
2.還有什麼類似的書里找不到，但是生產環境中常用的知識嗎？或者說在哪裡可以看到這些知識？

看一下問題日誌，其實你刪除的第二段，就完美的解釋為什麼要用div模擬placeholder了。

第二個問題你可以新開一個題目，其實常見的一些常識知識，其他樓也回答了，一些原生控制項，如select，options，input，或者很多不同input type的樣式是無法自定義的，或者不同終端無法統一交互的，都會選擇自己使用div+js來模擬實現。

舉個常見的，比如移動端的select，android和ios就都長的不一樣，不少產品會走極端，完全模擬一套ios的表現交互，這些也算是常識了。

這些知識，你只能在項目里遇到，或者遇到奇葩的產品經理才能get。。書上比較少，你可以平時多觀察一些常用的網站的交互效果，再F12對應去看實現來學習。

input有很多type，不知道你說哪一種。

如果是radio，默認樣式那麼丑能忍么，spec答應我都不答應。

如果是submit，reset，我覺得用button更好，反正都是ajax, 還能少些一行e.preventDefault()。

如果是text和password，我還沒見過誰無聊到模擬這個。

html5新增的number，email，url，date，range等，更不會有人去模擬啦。

瀉藥，沒見過用 div 模擬輸入框的，也許是我孤陋寡聞了？

模擬 placeholder 的倒是有不少，那是因為 IE8 不支持 placeholder.

我還見過用div模擬select，為了界面美觀不擇手段，破壞html標籤語義化，真是反人類行為(●°u°●) 」。如果是這樣的話，又會回到全部由div+css布局遠古時代

下拉框、複選框的樣式不能改，丑。

給div加個屬性contentEditable="true"就可以做編輯，樣式比較容易控制。操作方便。div相對input的樣式控制更加靈活，對於ie等版本瀏覽器的兼容性也更好，在實現更加複雜的ui設計上更靈活。

看了問題日誌，事實上知乎的編輯框即使沒使用原生控制項，依然導致了移動端游標亂跳的問題（Firefox）。

因為原生控制項的樣式在不同瀏覽器中是不同的，這可能會使頁面整體風格不協調。還有一些特性原生控制項中壓根沒有。

還有人覺得原生控制項太丑，然後調不好樣式（主要原因是低版本瀏覽器兼容性不好），又非要追求跨平台樣式的一致性，或者是故意限制自動化工具的使用。

不要學習這種做法，因為會破壞 HTML 的語義化，造成可讀性下降，並對網頁的無障礙化造成障礙。

很大程度上是為了每次不能用鍵盤控制或者讀屏軟體讀出來的不知道是什麼鬼的時候就會感覺很操蛋。

解決方法嘛！出個強制性的網頁無障礙標準，這樣由於自己搞無障礙適配困難較大，就會更趨向於使用原生控制項修改外觀的方式了，當然這工作要麼就是蘋果能做。要麼就是國家能做了。

因為看到[三星廣告](一場事故也可以有一個完美結局！)，想複製一下那個placeholder **已開啟預審評論, 評論由廣告主篩選後公開** 後評論。結果發現這個元素竟然是div。。。然而這個div明明沒有什麼特殊樣式，都可以用屬性或者偽類來實現，所以特意搜索到這個題目。原來是為了兼容IE8。

最近就遇到一個問題，用html做的頁面然後封裝成app，但是ios原生的input藍色游標實在破壞了整體的風格美感，而且無法修改樣式，嘗試了各種方案，最終還是選擇了使用div模擬，游標樣式，輸入的效果等等都可以用樣式就行修改，比較方便，當然，肯定是封裝成類庫復用

input 樣式不是原因好吧

無他，統一所有平台所有瀏覽器的樣式！

幾乎所有表單的默認樣式不同平台，不同瀏覽器表現都不一樣，而有一些樣式是無法重置的。

作為伺服器開發人員，實在是為前端的兼容感到操蛋。

長成什麼樣不都是ui說了算的，像checkbox,select之類的不能自定義的（同時為了統一各瀏覽器下的樣式），就只能通過div,span之類加js模擬了。要找的話各大網站登錄，註冊部分（其他的和賬號資料相關部分），或者github上找select,checkbox之類的star高的插件看看。

主要還是原生樣式比較丑；丑還不能簡單的統一，各種平台對非常規屬性的定義和實現有差別，一個placeholder就讓你明白～有些時候模擬還比調試樣式來得快捷，方便，好看！！！

1.div的樣式更容易更改