Как получить доступ к HTML-элементу без идентификатора?

function findFirstDescendant(parent, tagname)
{
   parent = document.getElementById(parent);
   var descendants = parent.getElementsByTagName(tagname);
   if ( descendants.length )
      return descendants[0];
   return null;
}

var header = findFirstDescendant("header-inner", "h1");

Находит элемент с заданным идентификатором, запрашивает потомков с заданным именем тега, возвращает первый. Вы также можете зацикливаться на descendants для фильтрации по другим критериям; Если вы начнете двигаться в этом направлении, я рекомендую вам проверить готовую библиотеку, такую ​​как jQuery (это сэкономит вам много времени на написание этого материала, это становится несколько сложнее).

Если вы уверены, что в вашем div только один элемент H1:

var parent = document.getElementById('header-inner');
var element = parent.GetElementsByTagName('h1')[0];

Перебирать потомков, как показал Shog9, тоже хороший способ.

Здесь я получаю значение элемента H1 в div, где элемент H1 с CSS class = "myheader":

var nodes = document.getElementById("mydiv")
                    .getElementsByTagName("H1");

for(i=0;i<nodes.length;i++)
{
    if (nodes.item(i).getAttribute("class") == "myheader")
        alert(nodes.item(i).innerHTML);
}      

Вот разметка:

<div id = "mydiv">
   <h1 class = "myheader">Hello</h1>
</div>

Я также рекомендовал бы использовать jQuery, если вам нужен тяжелый синтаксический анализ вашей DOM.

Самый простой способ сделать это с вашей текущей разметкой:

document.getElementById('header-inner').getElementsByTagName('h1')[0].innerHTML = 'new text';

Предполагается, что ваш тег H1 всегда является первым в элементе 'header-inner'.

Чтобы получить дочерние узлы, используйте obj.childNodes, который возвращает объект коллекции.

Чтобы получить первого ребенка, используйте list[0], который возвращает узел.

Итак, полный код должен быть:

var div = document.getElementById('header-inner');
var divTitleWrapper = div.childNodes[0];
var h1 = divTitleWrapper.childNodes[0];

Если вы хотите перебрать все дочерние элементы, сравнивая, относятся ли они к классу «title», вы можете выполнить итерацию, используя цикл for и атрибут className.

Код должен быть:

var h1 = null;
var nodeList = divTitleWrapper.childNodes;
for (i =0;i < nodeList.length;i++){
    var node = nodeList[i];
    if (node.className == 'title' && node.tagName == 'H1'){
        h1 = node;
    }
}

Если бы вы использовали jQuery, как упоминалось в некоторых плакатах, вы могли бы получить доступ к элементу очень легко, например (хотя технически это вернет коллекцию совпадающих элементов, если бы было более одного потомка H1):

var element = $('#header-inner h1');

Использование такой библиотеки, как JQuery, делает подобные вещи тривиальными по сравнению с обычными способами, упомянутыми в других сообщениях. Затем, когда у вас есть ссылка на него в объекте jQuery, у вас появляется еще больше функций, позволяющих легко управлять его содержимым и внешним видом.