自動目錄
常會用到的placeholder可以在沒填值時有提示的文字，想要改變格式該怎麼做？
HTML
<input type="text" placeholder="王大明" />
</label>
結果
預設的樣式是淺灰色，想要修改他的樣式：
使用STYLE屬性
在標籤中的style屬性無法修改到placeholder的樣式。
使用CSS
/* input tag */
input::placeholder { color: yellow; }
/* textarea tag */
textarea::placeholder { color: green; }
/* all tag */
::placeholder { color: #a4dbb7; }
/* 指定CHROME, EDGE, */
::-webkit-input-placeholder { color: grey; }
/* 指定firefoX */
::-moz-placeholder { color: yellow; }
placeholder 屬性是由 ::placeholder 選擇子(selector)來決定。
使用JQUERY/JAVASCRIPT
HTML
JAVASCRIPT取值
var ph= document.getElementsByName('namae')[0].placeholder;
var ph2 = document.getElementById ("namae").placeholder;
JAVASCRIPT給值
document.getElementsByName('namae')[0].placeholder= "Some New Text";
document.getElementById ("namae").placeholder= "Some New Text";
JQUERY取值
var ph3= $('#namae').attr('placeholder');
var ph4= $('input[name ="namae"]').attr('placeholder');
JQUERY給值
$('input:text').attr('placeholder','Some New Text');
$('#namae').attr('placeholder','Some New Text');
參考資料
[1] https://www.w3schools.com/csSref/sel_placeholder.asp
[2] https://css-tricks.com/almanac/selectors/p/placeholder-shown/
[3] Change placeholder text https://stackoverflow.com/questions/13506481/change-placeholder-text/13506567
