HTML 内联处理程序如何访问全局 window 对象和其中的变量?
How can HTML inline handlers access the global window object and variables inside it?
我正在测试一段代码。我有一个名为 write
的函数,我使用了一个带有内联 onclick
处理程序的按钮 运行 write()
.
function write(text) {
alert(text)
}
<button onclick='write("Some text")'>
Write
</button>
令我惊讶的是,write()
居然执行了document.write()
。可以肯定的是,我用更多的功能对其进行了测试。
function write(text) {
alert(text)
}
<button onclick='console.log(body)'>
document.body
</button>
然后,我想知道他们是否可以访问window
。事实证明他们可以。但是,document.window
是 undefined
.
console.log(document.window)
/*
Note that this example may not work due to StackSnippets using iframes
*/
<button onclick='window.open()'>
Open blank page
</button>
function doSomething(text) {
console.log(text)
}
<button onclick='doSomething("Some text")'>
doSomething
</button>
所以,我的问题是,为什么内联事件处理程序可以访问 window
的属性,即使 document
是全局范围,而 document.window
是 undefined
?
在内联事件处理程序中,如果 this.property
存在,则默认为该值。如果不是,它会回落到 document.property
。如果连那个都不存在,最后,它会在全局 window
范围内执行该代码。
一些例子
在此示例中,内联处理程序默认为 document
作为全局范围。
document.someProperty = 'something'
var someProperty = 'something else'
<button onclick='console.log(someProperty)'>
Button
</button>
本例默认为window
。
var someProperty = 'something'
<button onclick='console.log(someProperty)'>
Button
</button>
在另一个示例中,它默认为 this
,即元素。
<button style='color: red' onclick='console.log(style.color)'>
Button
</button>
我正在测试一段代码。我有一个名为 write
的函数,我使用了一个带有内联 onclick
处理程序的按钮 运行 write()
.
function write(text) {
alert(text)
}
<button onclick='write("Some text")'>
Write
</button>
令我惊讶的是,write()
居然执行了document.write()
。可以肯定的是,我用更多的功能对其进行了测试。
function write(text) {
alert(text)
}
<button onclick='console.log(body)'>
document.body
</button>
然后,我想知道他们是否可以访问window
。事实证明他们可以。但是,document.window
是 undefined
.
console.log(document.window)
/*
Note that this example may not work due to StackSnippets using iframes
*/
<button onclick='window.open()'>
Open blank page
</button>
function doSomething(text) {
console.log(text)
}
<button onclick='doSomething("Some text")'>
doSomething
</button>
所以,我的问题是,为什么内联事件处理程序可以访问 window
的属性,即使 document
是全局范围,而 document.window
是 undefined
?
在内联事件处理程序中,如果 this.property
存在,则默认为该值。如果不是,它会回落到 document.property
。如果连那个都不存在,最后,它会在全局 window
范围内执行该代码。
一些例子
在此示例中,内联处理程序默认为 document
作为全局范围。
document.someProperty = 'something'
var someProperty = 'something else'
<button onclick='console.log(someProperty)'>
Button
</button>
本例默认为window
。
var someProperty = 'something'
<button onclick='console.log(someProperty)'>
Button
</button>
在另一个示例中,它默认为 this
,即元素。
<button style='color: red' onclick='console.log(style.color)'>
Button
</button>