1.firefox не может поддержать внутренний текст.
Firefox поддерживает Innerhtml, но не поддерживает внутренний текст. Он поддерживает TextContent для реализации внутреннего текста, но ненужные пространства также сохраняются по умолчанию. Если вы не используете TextContent, если строка не содержит HTML -код, вы также можете использовать Innerhtml.
2. запрещено выбирать контент веб -страницы:
В IE обычно используется JS: obj.OnselectStart = function () {return false;}
Firefox использует CSS: -MOZ-USER-SELECT: Нет
3. Поддержка фильтра (пример: прозрачный фильтр):
Т.е. фильтр: альфа (непрозрачность = 10);
Firefox: -moz-oppany: .10;
4. Захват события:
Т.е. obj.setCapture (), obj.ReleaseCapture ()
Firefox: Document.AddeventListener ("MouseMove", MouseMoveFunction, True);
Document.RemoveEventListener ("MouseMove", MouseMoveFunction, True);
5. Получите положение мыши:
Т.е. event.clientx, event.clienty
Firefox: функция события должна пройти объект события
obj.onmousemove = function (ev) {
X = ev.pagex; y = ev.pagey;
}
6. Граничные проблемы таких элементов, как Div:
Например: установите Div's CSS :: {ширина: 100px; высота: 100px; граница:#000000 1px solid;}
IE: ширина Div (включая ширину границы): 100px, высота Div (включая ширину границы): 100px;
И Firefox: ширина Div (включая ширину границы): 102px, высота Div (включая ширину границы): 102px;
Поэтому при выполнении этого окна сопротивления, которое совместимо с IE и Firefox, вы должны использовать свой мозг, чтобы написать JS и CS, и дать вам два совета
1. Определите тип браузера:
var isie = document.all? Верно: Неверно;
Я написал переменную, если документ. Все синтаксис поддерживается, то ISIE = true, в противном случае ISIE = false
2. Обработка CSS в разных браузерах:
Как правило, вы можете использовать! Важно для определения приоритетов заявлений CSS (только поддерживается Firefox)
Например: {пограничная ширина: 0px!
Под Firefox этот элемент не имеет границы, и под т.е. ширина границы составляет 1px
1.document.formname.item ("itemname") Проблема
Описание задачи: IE, вы можете использовать document.formname.item ("itemname") или document.formname.elements ["elementName"]; В Firefox вы можете использовать только document.formname.elents ["elementName"].
Решение: используйте document.formname.elements ["elementName"] единым образом.
2. Проблема с объектом сбора
Описание проблемы: IE, вы можете использовать () или [], чтобы получить объект класса коллекции; В Firefox вы можете использовать только [], чтобы получить объект класса коллекции.
Решение: используйте [], чтобы получить объекты класса сбора единым образом.
3. Проблемы с атрибутами пользовательских атрибутов
Описание задачи: в IE вы можете использовать метод получения регулярных атрибутов для получения пользовательских атрибутов, или вы можете использовать getattribute () для получения пользовательских атрибутов; В Firefox вы можете использовать только getattribute () для получения пользовательских атрибутов.
Обходной путь: равномерно получить пользовательские атрибуты через getattribute ().
4. Eval ("idname") проблема
Описание задачи: IE, вы можете использовать Eval ("iDname") или GetElementById ("idName"), чтобы получить HTML -объект с iDname; В Firefox вы можете использовать только GetElementById («idName»), чтобы получить HTML -объект с idName.
Решение: используйте GetElementById ("idName"), чтобы получить объект HTML с ID как idName.
5. Проблема с тем же именем переменной, что и идентификатор объекта HTML
Описание задачи: под т.е. идентификатор объекта HTML может использоваться непосредственно в качестве имени переменной подчиненного объекта документа, но не в Firefox; Под Firefox имя переменной, которое совпадает с идентификатором объекта HTML, может использоваться, но не в IE.
Обходной путь: используйте Document.getElementById ("iDname") вместо Document.IdName. Лучше всего не принимать имена переменных с тем же идентификатором объекта HTML, чтобы уменьшить ошибки; При объявлении переменных добавьте ключевое слово var, чтобы избежать двусмысленности.
6. Конфликт выпуска
Описание задачи: В Firefox вы можете использовать ключевое слово const или ключевое слово var для определения констант; В IE вы можете использовать только ключевое слово var для определения констант.
Решение: используйте ключевое слово var, чтобы равномерно определить константы.
7. Проблема атрибута input.type
Описание задачи: свойство input.type в соответствии с т.е. только для чтения; но свойство входов.
Решение: не изменяйте свойство input.type. Если вам нужно изменить его, вы можете сначала скрыть исходный ввод, а затем вставить новый входной элемент в той же позиции.
8. Window.Event Проблема
Описание задачи: Window.Event может работать только под IE, а не в Firefox, потому что событие Firefox может использоваться только на сцене, где происходит событие.
Решение: добавьте параметры события в функцию, где происходит событие, и используйте var myevent = evt? Evt: (window.event? Window.event: null)
Пример:
Кода -копия выглядит следующим образом:
<input type = "button" onclick = "dosomething (event)"/>
<script language = "javascript">
Функция DoSomething (evt) {
var myevent = evt? evt: (window.event? window.event: null)
...
}
9. Event.x и Event.y Проблемы
Описание задачи: под т.е. ровный объект имеет атрибуты x и y, но нет атрибутов Pagex и Pagey; Под Firefox у ровного объекта есть атрибуты Pagex и Pagey, но нет атрибутов x и y.
Решение: var myx = event.x? Event.x: Event.pagex; var myy = event.y? Event.y: Event.pagey;
Если вы рассмотрите 8 -й выпуск, просто используйте Myevent вместо события.
10. event.srcelement Проблема
Описание задачи: в соответствии с т.е. vese объект имеет свойство Srcelement, но нет целевого свойства; В соответствии с Firefox у Evel Evloy объект имеет целевое свойство, но нет свойства Srcelement.
Решение: используйте srcobj = event.srcelement? Event.srcelement: event.target;
Если вы рассмотрите 8 -й выпуск, просто используйте Myevent вместо события.
11.window.location.href Проблема
Описание проблемы: в IE или Firefox2.0.x вы можете использовать window.location или window.location.href; В Firefox1.5.x вы можете использовать только Window.location.
Обходной путь: используйте window.location вместо window.location.href. Конечно, вы также можете рассмотреть возможность использования метода location.replace ().
12. Модальные и немодальные проблемы с окном
Описание задачи: под т.е. модальные и немодальные окна могут быть открыты через ShowModaldialog и ShowmodelessDialog; Под Firefox это не может.
Решение: используйте window.open (pageurl, имя, параметры), чтобы открыть новое окно.
Если вам нужно перенести параметры в окне дочернего окна обратно в родительское окно, вы можете использовать Window.Pener в окне ребенка, чтобы получить доступ к родительскому окну. Если родительское окно нужно контролировать окно ребенка, используйте var subwindow = window.open (pageurl, имя, параметры); Чтобы получить недавно открытый окно -объект.
13. ПРОБЛЕМЫ FRAME и IFRAME
Следующий кадр - это пример:
<frame src = "xxx.html" id = "frameid" name = "frameName" />
(1) Объект доступа к кадре
Т.е. используйте window.frameid или window.frameName, чтобы получить доступ к этому объекту кадра;
Firefox: используйте window.frameName для доступа к этому объекту кадра;
Решение: используйте window.document.getElementbyId ("frameId") для доступа к этому объекту кадра;
(2) Содержание рамки переключения
Как в IE, так и в Firefox вы можете использовать windo.document.getElementById ("frameID"). Src = "xxx.html" или window.framename.location = "xxx.html", чтобы переключить содержание кадра;
Если вам нужно передать параметры в кадре обратно в родительское окно, вы можете использовать родительское ключевое слово в кадре для доступа к родительскому окну.
14. Проблема загрузки тела
Описание задачи: объект тела Firefox существует до того, как тег тела полностью зачитывается браузером; В то время как объект тела IE должен существовать после того, как тег тела полностью читается в браузере.
[Примечание] Эта проблема еще не была проверена и будет изменена после проверки.
[Примечание] Было доказано, что вышеуказанные проблемы не существуют в IE6, Opera9 и Firefox2. Простой сценарий JS может получить доступ к всем объектам и элементам, которые были загружены до сценария, даже если этот элемент еще не был загружен.
15. Метод делегата событий
Описание задачи: в т.е. используйте Document.Body.onload = Inject; где функция inject () была реализована до этого; В Firefox используйте document.body.onload = inject ();
Решение: Использовать Document.body.onload = new Function ('inject ()'); или document.body.onload = function () {/* Вот код*/}
[Примечание] Разница между функцией и функцией
16. Различия между обращенными родительскими элементами
Описание проблемы: в соответствии с т.е. используйте obj.parentelement или obj.parentnode, чтобы получить доступ к родительскому узлу OBJ; Под Firefox используйте obj.parentnode, чтобы получить доступ к родительскому узлу OBJ.
Решение: Поскольку как Firefox, так и IE поддерживают DOM, OBJ.ParentNode используется для доступа к родительскому узлу OBJ.
17.cursor: рука против курсора: указатель
Описание проблемы: Firefox не поддерживает руку, но IE поддерживает указатель, оба являются индикаторами в форме ручной работы.
Решение: используйте указатель единым способом.
18. Проблема с внутренним текстом.
Описание проблемы: внутренний текст работает должным образом в IE, но InnerText не работает в Firefox.
Обходной путь: используйте TextContent вместо внутреннего текста в браузерах, не связанных с ИМ.
Пример:
Кода -копия выглядит следующим образом:
if (navigator.appname.indexof ("explorer")> -1) {
document.getElementbyId ('element'). innerText = "my Text";
} еще{
document.getElementById ('element'). TextContent = "My Text";
}
[Примечание] Innerhtml поддерживается браузерами, такими как IE и Firefox. Другие, такие как Overhtml, поддерживаются только IE, поэтому лучше не использовать его.
19. Проблема ширины объекта и назначения высоты
Описание задачи: утверждение, похожее на Obj.style.height = imgobj.height в Firefox, является недействительным.
Решение: используйте obj.style.height = imgobj.height + 'px' в форме;
20. Задачи таблицы.
Описание задачи: IE, Firefox и другие браузеры имеют разные операции на таблице. IE не разрешается назначать значения Innerhtml для таблицы и Tr. При использовании JS использование метода AppendChild не работает.
Решение:
Кода -копия выглядит следующим образом:
// Добавить пустую линию в таблицу:
var row = otable.insertrow (-1);
var cell = document.createElement ("td");
cell.innerhtml = "";
cell.classname = "xxxx";
row.appendchild (cell);
[Примечание] Поскольку я редко использую JS для непосредственного управления таблицами, я никогда не сталкивался с этой проблемой. Рекомендуется использовать наборы Framework JS для манипулирования таблицами, такими как jQuery.
21. Выпуск UL и OL List Cadent
При устранении отступления списков, таких как UL, OL и т. Д., Стиль должен быть написан как: Список стиля: нет; поля: 0px; Заполнение: 0px;
Атрибут маржи действителен для IE, а атрибут прокладки действителен для Firefox. ← Это предложение неверно, см. Подробности ↓
[Примечание] Эта проблема еще не была проверена и будет изменена после проверки.
[Примечание] Было доказано, что в т.е. настройка маржа: 0PX может удалить вверх и вниз левое и правое отступы, пробелы, номера списков или точки списка, а настройка накладки не влияет на стиль; В Firefox установка заезда: 0PX может удалить только белое пространство вверх и вниз, и после настройки накладки: 0PX может удалить только левое и правое отступы, а также необходимо установить стиль списка: нет, чтобы удалить номер списка или точки. Другими словами, IE, вы можете достичь окончательного эффекта, просто установив маржу: 0PX, прокладка: 0PX и в стиле списка: ни один должен быть установлен одновременно в Firefox для достижения окончательного эффекта.
22. Проблема прозрачности CSS
Т.е. фильтр: Прогид: dximagetransform.microsoft.alpha (style = 0, opacity = 60).
FF: непрозрачность: 0,6.
[Примечание] Лучше всего написать оба и поместить атрибут непрозрачности ниже.
23. CSS закругленная угловая проблема
IE: Следующие версии IE7 не поддерживают округлые углы.
FF: -moz-border-radius: 4px или -moz-border-radius-topleft: 4px; -Моз-грамотный-радий-топрайт: 4px; -Моз-грамотный радий-ботемлефт: 4px; -Моз-грамотный-радиус-ботемрайт: 4px;.
[Примечание] Закругленная угловая проблема - это классическая проблема в CSS. Рекомендуется использовать структуру jQuery, установленную для установки округлых углов, чтобы оставить эти сложные проблемы для других.
Есть слишком много вопросов о CSS, и даже те же определения CSS имеют разные эффекты отображения в разных стандартах страниц. Подходящее предложение заключается в том, что страница написана в стандартном стандарте DHTML, и использование таблиц редко используется. Определение CSS должно быть основано на стандартном DOM как можно больше, а также учитываются основные браузеры, такие как IE, Firefox и Opera. Кстати, во многих случаях стандарты интерпретации CSS FF и Opera находятся ближе к стандартам CSS и более стандартизированы.