Ищете простой пример JavaScript, который обновляет DOM
-
09-06-2019 - |
Вопрос
Я ищу простой пример JavaScript, который обновляет DOM.
Есть какие-нибудь предложения?
Решение
Вот краткий пример с использованием чистого javascript.Предположим, у вас есть div с идентификатором "maincontent".
var newnode = document.createTextNode('Here is some text.');
document.getElementById('maincontent').appendChild(newnode);
Конечно, с jQuery все намного проще (особенно когда вы хотите делать более сложные вещи).
Другие советы
Вот рабочий пример вашего кода
<html>
<head>
<title>Font Detect please</title>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript">
function changeTD()
{
$('Myanmar3').innerHTML = 'False';
}
</script>
</head>
<body>
<table border="1">
<tr><td>Font</td><td>Installed</td></tr>
<tr><td>Myanmar3</td><td id="Myanmar3">True</td></tr>
</table>
<a href="javascript:void(0);" onclick="changeTD();">Click Me</a>
</body>
</html>
Вы заметите, что я добавил небольшую ссылку, на которую вы должны нажать, чтобы действительно внести изменения.Я подумал, что так будет легче попробовать себя по-настоящему.
Я полагаю, что в этом руководстве по jQuery есть пример, который может вам помочь: http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery
Более конкретный вопрос мог бы дать более полезные результаты, но вот простая пара фрагментов, которые показывают, а затем обновляют текст в элементе контейнера состояния.
// give some visual cue that you're waiting container.appendChild( document.createTextNode( "Getting stuff from remote server..." ) ); // then later... // update request status container.replaceChild( document.createTextNode( "Done." ), container.firstChild );
<html>
<head>
<title>Font Detect please</title>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript">
$('Myanmar3').update('False');
$('Myanmar3').innerHTML;
</script>
</head>
<body>
<table border="1">
<tr><td>Font</td><td>Installed</td></tr>
<tr><td>Myanmar3</td><td id=Myanmar3>True</td></tr>
</table>
</body>
</html>
У меня есть простой код, подобный приведенному выше, и я пытаюсь изменить результат True на false с помощью Javascript, используя Prototype.Что я могу делать не так?
Редактировать:Понял.Я этого не называл.:D