小书签在 Firefox 中不起作用
我编写了一个脚本来更改设计糟糕的页面上的 CSS 元素。我在 Chrome 中对其进行了测试,现在它功能齐全。我已将其放在网络上,现在将其用作书签文本:
javascript:(function(){document.body.appendChild(document.createElement('script')).src='http://myexamplewebsite.com/files/adjustPage.js';})();
它在 Chrome 上完美运行,但在最新的 Firefox 或 IE 中不起作用。我查看了 Chrome 和 Firefox 的错误控制台,没有人抱怨任何问题。当我将代码放入错误控制台的“代码”字段并进行评估时,Firefox 也没有反应。
Firefox 确实在底部的小状态栏中显示:“Read myexamplewebsite.com”,但没有其他内容。
这不是我上面运行的书签代码中的一个怪癖,因为我在同一台服务器上放置了一个“hello world”脚本,并且运行良好。
有没有更好的方法来找出 Firefox/IE 不喜欢我的脚本的地方?
如果您有兴趣,我正在运行的代码就在这里。请原谅代码的丑陋,这是一个非常快速和肮脏的黑客:
var section = document.getElementsByClassName('cqGroupBox');
for(var i in section) {
var children = section[i].childNodes;
for(var j in children){
if(children[j].innerText == 'Detected on configuration') {
var style = section[i].getAttribute('style');
style += ' display:none;';
section[i].setAttribute('style', style);
break;
}
}
}
var tables = document.getElementsByTagName('table');
for(var i in tables) {
try{
var styleNode = tables[i].attributes.getNamedItem('style');
var style = styleNode.firstChild.nodeValue;
if(style == null) {
continue;
}
if(style.match('top: 434px; left: 120px;')
|| style.match('top: 461px; left: 120px;')
|| style.match('top: 434px; left: 456px;')
|| style.match('top: 461px; left: 456px;')){
style += ' display:none;';
tables[i].attributes.getNamedItem('style').firstChild.nodeValue = style;
}
} catch(err){continue;}
}
var labels = document.getElementsByTagName('label');
for(var i in labels) {
try{
var styleNode = labels[i].attributes.getNamedItem('style');
var style = styleNode.firstChild.nodeValue;
if(style == null) {
continue;
}
if(labels[i].innerText == 'OS'
|| labels[i].innerText == 'App. Server'
|| labels[i].innerText == 'DBMS'
|| labels[i].innerText == 'Web Server'){
style += ' display:none;';
labels[i].attributes.getNamedItem('style').firstChild.nodeValue = style;
}
} catch(err){continue;}
}
var divs = document.getElementsByTagName('div');
for(var i in divs) {
try {
var styleNode = divs[i].attributes.getNamedItem('style');
var style = styleNode.firstChild.nodeValue;
if(style == null) {
continue;
}
if(style.match('top: 291px; left: 23px;')){
style.replace('height: 109px;','');
divs[i].attributes.getNamedItem('style').firstChild.nodeValue = style;
innerDivs = divs[i].getElementsByTagName('div');
for(var j in innerDivs){
try {
innerStyle = innerDivs[j].attributes.getNamedItem('style').firstChild.nodeValue;
if(innerStyle.match('width: 665px; height: 109px;')){
innerStyle = innerStyle.replace('height: 109px;','');
innerStyle += ' font-size: 130%';
innerDivs[j].attributes.getNamedItem('style').firstChild.nodeValue = innerStyle;
}
} catch(err){continue;}
}
}
} catch(err){continue;}
}
I've written a script that changes the CSS elements on a badly designed page. I was testing it in Chrome as I went along, and now it's fully functional. I've placed it on the web and am now using this as the bookmarklet text:
javascript:(function(){document.body.appendChild(document.createElement('script')).src='http://myexamplewebsite.com/files/adjustPage.js';})();
It works perfectly on Chrome, but doesn't work in the latest Firefox or IE. I've looked in the error consoles of Chrome and Firefox and neither one complains of any issues. Firefox also doesn't react when I put the code in the 'code' field of the error console and evaluate.
Firefox does say in the little status bar at the bottom: "Read myexamplewebsite.com", but nothing else.
It isn't a quirk in the bookmarklet code I'm running above, because I've placed a 'hello world' script on the same server and it worked fine.
Is there a better way to work out what Firefox/IE don't like about my script?
If you're interested, the code I'm running is here. Please excuse the ugliness of the code, it was a very quick and dirty hack:
var section = document.getElementsByClassName('cqGroupBox');
for(var i in section) {
var children = section[i].childNodes;
for(var j in children){
if(children[j].innerText == 'Detected on configuration') {
var style = section[i].getAttribute('style');
style += ' display:none;';
section[i].setAttribute('style', style);
break;
}
}
}
var tables = document.getElementsByTagName('table');
for(var i in tables) {
try{
var styleNode = tables[i].attributes.getNamedItem('style');
var style = styleNode.firstChild.nodeValue;
if(style == null) {
continue;
}
if(style.match('top: 434px; left: 120px;')
|| style.match('top: 461px; left: 120px;')
|| style.match('top: 434px; left: 456px;')
|| style.match('top: 461px; left: 456px;')){
style += ' display:none;';
tables[i].attributes.getNamedItem('style').firstChild.nodeValue = style;
}
} catch(err){continue;}
}
var labels = document.getElementsByTagName('label');
for(var i in labels) {
try{
var styleNode = labels[i].attributes.getNamedItem('style');
var style = styleNode.firstChild.nodeValue;
if(style == null) {
continue;
}
if(labels[i].innerText == 'OS'
|| labels[i].innerText == 'App. Server'
|| labels[i].innerText == 'DBMS'
|| labels[i].innerText == 'Web Server'){
style += ' display:none;';
labels[i].attributes.getNamedItem('style').firstChild.nodeValue = style;
}
} catch(err){continue;}
}
var divs = document.getElementsByTagName('div');
for(var i in divs) {
try {
var styleNode = divs[i].attributes.getNamedItem('style');
var style = styleNode.firstChild.nodeValue;
if(style == null) {
continue;
}
if(style.match('top: 291px; left: 23px;')){
style.replace('height: 109px;','');
divs[i].attributes.getNamedItem('style').firstChild.nodeValue = style;
innerDivs = divs[i].getElementsByTagName('div');
for(var j in innerDivs){
try {
innerStyle = innerDivs[j].attributes.getNamedItem('style').firstChild.nodeValue;
if(innerStyle.match('width: 665px; height: 109px;')){
innerStyle = innerStyle.replace('height: 109px;','');
innerStyle += ' font-size: 130%';
innerDivs[j].attributes.getNamedItem('style').firstChild.nodeValue = innerStyle;
}
} catch(err){continue;}
}
}
} catch(err){continue;}
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
innerText
是一个非标准属性(到目前为止;现在正在努力为其创建标准),Gecko 不支持它。使用textContent
可以解决问题吗?innerText
is a nonstandard property (so far; there are now efforts to create a standard for it) which is not supported in Gecko. Does usingtextContent
instead fix things for you?以下是固定代码,适用于 Chrome、Firefox 3.6 和最新的 Firefox(截至 2011 年 8 月)。
如果您在查找可用内容等方面遇到问题,请参阅 Gecko DOM。
Here is the fixed code, that works on Chrome, Firefox 3.6 and the latest Firefox (as of Aug 2011).
See the Gecko DOM if you're having issues finding out what's available for use, etc.