代码之家 › 专栏 › 技术社区 › KawaiKx

html中前后斜杠的奇怪行为

html

-1

KawaiKx · 技术社区 · 7 年前

请考虑一下这个代码。一个反斜杠在img tag中起作用,但在button tag中不起作用:

<body>
    <h4>This is Me.</h4>
    <img src='C:\Users\foo\Pictures\Camera Roll\pic1.jpg' height="100px" width="100px" id="myImage">
    <button onclick='document.getElementById("myImage").src="C:\Users\foo\Pictures\Camera Roll\pic2.jpg"'>This is you</button>

</body>

当我点击按钮时,什么也没发生。形象不变。

现在,如果我在按钮标记中用正斜杠更改反斜杠,它就可以工作了!

<button onclick='document.getElementById("myImage").src="C:/Users/foo/Pictures/Camera Roll/pic2.jpg"'>This is you</button>

弄不清是怎么回事。

有线索吗?

2 回复 | 直到 7 年前

Quentin 7 年前

的价值 onclick 属性是JavaScript。在JavaScript中, \ 是转义字符,并表示你需要逃离它(也就是说。 \\ ).

既然你没有,你最后得到的字符串是:

console.log("C:\Users\foo\Pictures\Camera Roll\pic2.jpg");

的价值 src \ 不是纯HTML中的转义字符。

而不是逃避 \ / 因为:

url使用/作为路径分隔符
Web浏览器在处理Windows路径时,仍然使用URL处理代码,因此可以或多或少地互换使用。

Akash Srivastav 7 年前

反斜杠是转义字符,所以放在反斜杠后面的任何内容都会有不同的解释。

为此,请添加一个额外的反斜杠,以转义要放入地址中的反斜杠,即替换单个反斜杠 \ 双反斜杠 \\

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Jamie · 在CSS链接的文件名中添加Jinja占位符

1 年前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

1 年前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

1 年前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

1 年前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

1 年前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

1 年前