Java Script для редактирования содержимого страницы на лету

document.designMode поддерживается в IE 4+ (который, по-видимому, запустил его) и FireFox 1.3+. Вы включаете его и можете редактировать контент прямо в браузере, это довольно странно. Я никогда не использовал его раньше, но похоже, что он идеально подходит для ручного сбора информации для печати.

Отредактировано, чтобы сказать: похоже, он также работает в Google Chrome. Я тестировал его только в Chrome и Firefox, так как это браузеры, в которых у меня есть консоль javascript, поэтому я не могу гарантировать, что он работает в Internet Explorer, поскольку я лично никогда не использовал его. Насколько я понимаю, это свойство, предназначенное только для IE, подобрали другие браузеры и в настоящее время не поддерживает никаких стандартов, поэтому я был бы удивлен, если Firefox и Chrome поддерживают его, но IE остановился.

Свойство contentEditable - это то, что вам нужно - оно поддерживается IE, Safari (и Chrome как побочный продукт), а я считать firefox 3 (увы, не FFX2). И это тоже часть HTML5: D

Firefox 2 поддерживает designMode, но он ограничен отдельными фреймами, тогда как свойство contentEditable применяется к отдельным элементам, так что вы можете сделать так, чтобы ваш редактируемый контент лучше воспроизводился на вашей странице: D

[Edit (olliej): удален пример, поскольку атрибут contentEditable не пропускает фильтры вывода SO (несмотря на то, что он работает в предварительном просмотре) :(]

[Edit (olliej): я использовал очень простой демонстрация, чтобы проиллюстрировать его поведение]

[Edit (olliej): Да, атрибут contentEditable в связанной демонстрации отлично работает в IE, Firefox и Safari. Увы, изменение размера - это функция css3, которую, похоже, поддерживает только webkit, а IE делает все возможное, чтобы бороться почти со всем CSS. вздох]

Он включает встроенные в браузер функции редактирования, если они доступны. Как упоминалось выше, designMode - это Gecko, а contentEditable - это все остальные (и добавлено в Gecko 1.9). Эти функции используются в качестве основы (почти?) Каждого редактора WYSIWYG, созданного с помощью HTML / Javascript. Если вы просто вводите / удаляете, ничего больше не потребуется, кроме предоставленного вами сценария. (Однако все, начиная с void и далее, излишне.)

Для документации о том, как эти функции могут использоваться в приложении, лучше всего обратиться к Mozilla Спецификация Midas (MSDN также может быть полезен ...).