Как получить доступ к элементу HTML без идентификатора?
Это:
- невозможно с GitHub (вам нужно будет добавить пользователя в качестве участника частного репо)
- обсуждалось, но еще не реализовано в GitLab: выпуск 20549: «Поделиться личным проектом по URL» (с апреля 2016 г.)
. те, которые вы упомянули), чтобы упаковать / опубликовать (и обновить) ваш репозиторий, чтобы любой пользователь мог получить к нему доступ по ссылке. Например, опубликуйте его как комплект (один файл) .
6 ответов
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 (сохранит Вас много времени, пишущий этот материал, это становится несколько хитрым).
Если необходимо было использовать jQuery, как упомянуто некоторыми плакатами, можно получить доступ к элементу очень легко как так (хотя технически это возвратило бы набор соответствия элементам, если бы был больше чем один потомок H1):
var element = $('#header-inner h1');
пользование библиотекой как JQuery делает вещи как это тривиальными по сравнению с нормальными путями, как упомянуто в других сообщениях. Тогда, как только у Вас есть ссылка на него в объекте jQuery, у Вас есть еще больше функций, доступных для легкого управления его содержанием и появлением.
Если Вы уверены, что существует только один элемент H1 в Вашем отделении:
var parent = document.getElementById('header-inner');
var element = parent.GetElementsByTagName('h1')[0];
Прохождение через потомков, поскольку Shog9 показал, является пользой слишком.
Самый простой способ сделать его с Вашей текущей разметкой:
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”, можно выполнить итерации использования для цикла и эти 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;
}
}
Здесь я получаю значение элементов H1 в отделении, где элемент H1, который имеет класс CSS = "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.