[英]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.