哪些字符可用于命名JavaScript变量？
我想在这里为我的非JavaScript用户创建一个小的"扩展库"(当涉及到语言时,他们似乎都很娇气).我喜欢jQuery和Prototype都使用$美元符号,因为我使用jQuery,我正在寻找另一个好用的单字符符号.
我意识到我可以测试一些角色,但我希望能够缩小我的角色列表(考虑到未来可能与另一个流行的库集成).
研究一个简单的HTMLElement包装器的想法我偶然发现了Internet Explorer和Chrome的以下内容:
对于DOM树中具有ID的给定HTMLElement,可以使用其ID作为变量名来检索div.所以对于一个喜欢的div
<div id="example">some text</div>
在Internet Explorer 8和Chrome中,您可以执行以下操作:
alert(example.innerHTML); //=> 'some text'
要么
alert(window['example'].innerHTML); //=> 'some text'
那么,这是否意味着DOM树中的每个元素都转换为全局命名空间中的变量？它是否也意味着可以使用它作为getElementById这些浏览器中方法的替代品？
我开始使用的所有浏览器都允许id="myDiv"通过简单地编写来访问元素:
myDiv
见这里:http://jsfiddle.net/L91q54Lt/
无论如何,这种方法似乎记录很少,事实上,我遇到的来源甚至没有提及,而是假设有人会使用
document.getElementById("myDiv")
或者可能
document.querySelector("#myDiv")
即使在事先知道其ID(即不在运行时计算)时也要访问DOM元素.我可以说,后者的方法具有保持代码安全的优势,如果有人无意中尝试myDiv在更广泛的范围内重新定义(虽然不是这么好的想法......),用一些不同的值覆盖它并继续而没有注意到冲突.
但其他那个呢？除了代码设计之外,使用上面的简短形式是否有任何问题,或者我在这里缺少什么？
请考虑以下代码:
<html>
<head></head>
<body>
<div id='test' class='blah'>
<a href='http://somesite.com/' id='someLink'>click!</a>
</div>
</body>
</html>
所以我最近发现这创建了一个调用的javascript对象someLink,我可以用例如获取href属性的值someLink.href.我在最新的Chrome,FF和IE中对此进行了测试,它确实有效.
首先,这个"功能"到底有多长？我想可能有一段时间了,因为我已经知道多年来页面上html元素的ID必须是唯一的,如果你有多个元素共享相同的ID,最后一个元素会覆盖前一个元素,并且使用例如getElementById()将返回最后一个.但我从来没有真正理解为什么,但现在,把它视为"这是创造一个对象"的观点,这是有道理的.所以,只要能够使用id-name-as-javascript对象直接访问它...它有多久了？IE6时代？早些时候？
第二......我想这更像是一个讨论点而不是问题,但是... IMO这似乎不是一个非常好的"功能"......不是有一个DOM和包装器的重点功能,如getElementById(),给一些组织,更重要的是,减少名称空间问题？我不觉得我应该担心页面上的随机html元素会覆盖我的javascript变量(最近发生的事情,这就是我发现这个"功能"的原因).有谁知道为什么会这样,它背后的逻辑是什么？
我正在开发Chrome扩展程序.我没有使用manifest.json匹配所有URL的内容脚本,而是chrome.tabs.executeScript在用户单击扩展图标时通过调用来懒惰地注入内容脚本.
我正在尝试的是避免多次执行脚本.所以我在我的内容脚本中有以下代码:
if (!window.ALREADY_INJECTED_FLAG) {
window.ALREADY_INJECTED_FLAG = true
init() // <- All side effects go here
}
问题#1,chrome.tabs.executeScript每次点击扩展图标时这是否足够安全？换句话说,这是幂等的吗？
问题#2,是否有类似的方法chrome.tabs.insertCSS？
似乎无法在backgroud脚本中检查内容脚本注入状态,因为它无法访问网页的DOM.我已经尝试了ping/pong方法来检查任何内容脚本实例是否存活.但这会带来设计ping超时的开销和复杂性.
问题#3,任何更好的后台脚本方法来检查内容脚本的注入状态,所以我可以阻止chrome.tabs.executeScript每次用户点击图标时调用？
提前致谢!
我注意到在几个浏览器中,dom元素只能通过它们的id访问:
HTML
<div id="chocolat"></div>
JS
alert(chocolat.id); //alerts "chocolat
chocolat; //points to the node
window.chocolat; //idem
chocolat === document.getElementById('chocolat'); // true
(在这里测试:http://jsfiddle.net/GUUPT/)这适用于Chrome上的某些版本的IE,但它不适用于Firefox(5).
我好奇这是从哪里来的？这是标准吗？
假设我有一个div看起来像:
<div id="testDiv">some stuff in here</div>
我有一个定义对象文字的脚本:
var testObject =
{
testDiv: $("#testDiv"),
testDivProperty: this.testDiv
};
为什么我访问时testObject.testDiv获得对jQuery对象的引用,即
[<div id=?"testDiv">?…?</div>?]
但是当我访问时,testObject.testDivProperty我获得了对实际元素的引用,即
<div id=?"testDiv">?…?</div>?
因此我无法执行jQuery操作testObject.testDivProperty？
在 javascript 中，我总是使用 docuemtn.getElementById 来访问 DOM 元素，但最近我不小心只使用 id 访问它并且它起作用了。例子：
<input id="element_id" type="text">
并在 JavaScript 中
element_id.onclick=fun;
它是正确的代码吗？为什么它有效？（在我拥有的所有浏览器中）
我刚刚注意到，在 Chrome 中不再需要选择具有 id 的元素，例如 with getElementById，您可以直接使用其名称调用该元素id...例如"para1"在此示例中：
<head>
<title>getElementById Beispiel</title>
<script>
function changeColor(newColor) {
para1.style.color = newColor;
}
</script>
</head>
<body>
<p id="para1">Irgendein Text</p>
<button onclick="changeColor('blue');">Blau</button>
<button onclick="changeColor('red');">Rot</button>
</body>这方面还有更多规范吗？在互联网上没有找到任何有关它的信息..