是否有可能浏览器放弃对曾经很常见的标签或元素的支持？为了提供一个更适合SO问答模板的问题,我将重新解释以上所有内容：是否知道浏览器已经放弃了对曾经常见的属性或元素的支持？
我能找到的唯一一件事是在the docs,说明：
Deprecated A deprecated element or attribute is one that has been outdated by newer constructs. Deprecated elements are defined in the
reference manual in appropriate locations,but are clearly marked as
deprecated. Deprecated elements may become obsolete in future versions
of HTML.User agents should continue to support deprecated elements for reasons of backward compatibility.
Definitions of elements and attributes clearly indicate which are
deprecated.
我认为,这不是基于意见的.我问的是,是否存在已经不再被浏览器支持的标签的情况.这不受意见的约束.但是我确实理解这个问题对它有一种开放的感觉.因此,我想澄清一下,我正在寻找浏览器放弃支持的实际和事实证据.我不是要求任何预见者站出来承认他们的神奇力量,我只是在寻找过去发生的案例.
请注意,欢迎提出有关我问题有效性的评论 – 而不是简单地投票.
解决方法
var dep= 'acronym|applet|basefont|bgsound|big|blink|center|dir|font|frame|frameset|hgroup|isindex|listing|marquee|menu|multicol|nextid|nobr|noembed|noframes|plaintext|spacer|strike|tt|xmp'.split('|');
var s= '<table>';
dep.forEach(function(val) {
var el= document.createElement(val),str= el.toString().slice(8,-1),style= 'HTMLElement HTMLPhraseElement HTMLBlockElement HTMLPreElement HTMLSpanElement HTMLDivElement'.indexOf(str)>-1 ? 'background:yellow' :
str==='HTMLUnknownElement' ? 'background:orange' :
'';
el.innerHTML= val;
document.body.appendChild(el);
s+= '<tr style="'+style+'"><td>'+val+'<td>'+str;
});
s+= '</table>';
document.getElementById('list').innerHTML= s;
以下是当前版本的基于Windows的浏览器的输出：
我们可以假设该浏览器不支持以橙色突出显示的任何内容,以黄色突出显示的任何内容都是iffy,其余内容应完全受支持.
为了确定通用“HTMLElements”的“iffyness”程度,我们可以将它们的默认CSS样式与span或div元素的默认样式进行比较.下面的代码片段通过在列表中添加一个新列来实现此目的,该列显示与每个已弃用元素不同的样式.
“HTMLUnknownElement”类型的元素没有不同的样式(如预期的那样).大多数其他元素都有.对于那些不这样做的人,这并不一定意味着他们不支持不同的属性.例如,font元素的样式与span的默认样式匹配 – 但font元素支持span不支持的属性size和face.
function getStyles(el) {
var gcs= getComputedStyle(el),st= gcs.cssText ? gcs.cssText.split(/; */) : el.currentStyle,obj= {},i,j,sp;
for(var i = 0 ; i < st.length ; i++) {
sp= st[i].split(':')[0];
if(j = gcs.getPropertyValue(sp)) {
obj[sp]= j;
}
}
return obj;
} //getStyles
function compStyles(st1,st2) {
var s= '';
for(var i in st1) {
if(st1[i] && st1[i] !== st2[i]) {
s+= i+': '+st1[i]+' - '+st2[i]+'; ';
}
}
return s;
} //compStyles
var dep= 'acronym|applet|basefont|bgsound|big|blink|center|dir|font|frame|frameset|hgroup|isindex|listing|marquee|menu|multicol|nextid|nobr|noembed|noframes|plaintext|spacer|strike|tt|xmp'.split('|'),s= '<table>',els= [],spanStyles=
getStyles(
document.body.appendChild(
document.createElement('span')
)
),divStyles=
getStyles(
document.body.appendChild(
document.createElement('div')
)
);
dep.forEach(function(val) {
var el= document.createElement(val),display,style= 'HTMLElement HTMLPhraseElement HTMLBlockElement HTMLPreElement HTMLSpanElement HTMLDivElement'.indexOf(str)>-1 ? 'background:yellow' :
str==='HTMLUnknownElement' ? 'background:orange' :
'';
document.body.appendChild(el);
display= getStyles(el).display;
el.innerHTML= val;
els.push(el);
s+= '<tr style="'+style+'">'+
'<td>'+val+
'<td>'+str+
'<td>'+display+
'<td>'+compStyles(
getStyles(el),display==='block' ? divStyles : spanStyles
)+
'<td>';
});
s+= '</table>';
document.getElementById('list').innerHTML= s;
var td= document.querySelectorAll('td:last-child');
dep.forEach(function(val,idx) {
td[idx].appendChild(els[idx]);
});
table {
font: 12px verdana;
border-spacing: 0px;
border: 1px solid black;
}
td {
vertical-align: top;
border-right: 1px solid #ddd;
border-bottom: 1px solid #bbb;
}
<div id="list"></div>
