[英]Embedding Javascript into an HTML parameter
我正在尋找將javascript嵌入到html參數中的正確方法。 這是我想要做的一個例子:
<img src="source.png" height="<script> if(screen.width == 1920)
{document.write('60px');}</script>"
title="icon"/>
我知道以這種方式嵌入PHP可以工作,但我似乎無法使用Javascript。 我對這個問題的了解有限,我需要一些幫助來解決這個問題。 謝謝。
請注意我添加到元素的id="sourceImg"
,每個元素每頁必須是唯一的。 不這樣做將意味着Javascript將不知道選擇哪個元素,並將選擇一個。
<img id="sourceImg" src="source.png" title="icon">
<script>
if (screen.width == 1920) {
document.getElementById('sourceImg').style.height = '60px';
}
</script>
要么需要在標記落入頁面源之后運行,要么在window.onload
事件處理程序中運行。 如果它在img
元素可用之前運行,則會出錯。
注 - 他在下面的評論中描述的JohnFx的方法是:
<img id="sourceImg" src="source.png" title="icon" onload="sizeMe()">
<script>
function sizeMe() {
if (screen.width == 1920) {
document.getElementById('sourceImg').style.height = '60px';
}
}
</script>
這使用了img
元素的onload
處理程序。 請注意,內聯事件處理程序(如onload=""
, onclick=""
等)通常被認為難以維護。 但是,上述應該可以作為演示,其他路由涉及理解頁面加載,DOM元素可用性以及其他可能比簡單示例更難理解的細節。
編輯
而且,從技術上講 ,你可以這樣做:
<img id="sourceImg"
onload="if(screen.width < 1920) this.style.width='60px';"
src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/ae/001_Jornal_Monsenhor_A_Comarca_23_de_Marco_de_1947.jpg/762px-001_Jornal_Monsenhor_A_Comarca_23_de_Marco_de_1947.jpg"
title="icon">
注意,我更改了if
語句以使更改更加明顯。
但請不要 。 進入是一個壞主意和壞習慣。 花一些時間來計算頁面加載和DOM可用性,這是花費的時間。
你不能這樣做。 你是對的 - 你的PHP干擾了。 有很多方法可以做到這一點,只需改變你的方法:
<script>
document.write("<img src='source.png' title='icon' " + screen.width == 1920 ? "height='60px'" : "" + " />");
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.