Поиск элементов в DOM

Форум

Учебник Node.JS скринкаст Стандарт языка

Справочник

Discord чат

 
Статьи Тест знаний Аналоги функций PHP

Курсы javascript

 

Update: Более новый материал по этой теме находится по адресу https://learn.javascript.ru/searching-elements-dom.

Стандарт DOM предусматривает несколько средств поиска элемента. Это методы getElementById, getElementsByTagName и getElementsByName.

Более мощные способы поиска предлагают javascript-библиотеки.

Поиск по id

Самый удобный способ найти элемент в DOM - это получить его по id. Для этого используется вызов document.getElementById(id)

Например, следующий код изменит цвет текста на голубой в div'е c id="dataKeeper":

document.getElementById('dataKeeper').style.color = 'blue'

Поиск по тегу

Следующий способ - это получить все элементы с определенным тегом, и среди них искать нужный. Для этого служит document.getElementsByTagName(tag). Она возвращает массив из элементов, имеющих такой тег.

Например, можно получить второй элемент(нумерация в массиве идет с нуля) с тэгом li:

document.getElementsByTagName('LI')[1]

Что интересно, getElementsByTagName можно вызывать не только для document, но и вообще для любого элемента, у которого есть тег (не текстового).

При этом будут найдены только те объекты, которые находятся под этим элементом.

Например, следующий вызов получает список элементов LI, находящихся внутри первого тега div:

document.getElementsByTagName('DIV')[0].getElementsByTagName('LI')

Получить всех потомков

Вызов elem.getElementsByTagName('*') вернет список из всех детей узла elem в порядке их обхода.

Например, на таком DOM:

<div id="d1">
  <ol id="ol1">
    <li id="li1">1</li>
    <li id="li2">2</li>
  </ol>
</div>

Такой код:

var div = document.getElementById('d1')
var elems = div.getElementsByTagName('*')

for(var i=0; i<elems.length; i++) alert(elems[i].id)

Выведет последовательность: ol1, li1, li2.

Поиск по name: getElementsByName

Метод document.getElementsByName(name) возвращает все элементы, у которых имя (атрибут name) равно данному.

Он работает только с теми элементами, для которых в спецификации явно предусмотрен атрибут name: это form, input, a, select, textarea и ряд других, более редких.

Метод document.getElementsByName не будет работать с остальными элементами типа div,p и т.п.

Другие способы

Существуют и другие способы поиска по DOM: XPath, cssQuery и т.п. Как правило, они реализуются javascript-библиотеками для расширения стандартных возможностей браузеров.

Также есть метод getElementsByClassName для поиска элементов по классу, но он совсем не работает в IE, поэтому в чистом виде им никто не пользуется.

Частая опечатка связана с отсутствием буквы s в названии метода getElementById, в то время как в других методах эта буква есть: getElementsByName.

Правило здесь простое: один элемент - Element, много - Elements. Все методы *Elements* возвращают список узлов.


Автор: Octane, дата: 14 августа, 2008 - 13:27

#permalink

Современные браузеры (FireFox 3, Opera 9.5, Safari 3.1) поддерживают метод «getElementsByClassName».

document.getElementsByClassName('class-name');
node.getElementsByClassName('class-name');
document.getElementsByClassName('class-name-1 class-name-2');
node.getElementsByClassName('class-name-1 class-name-2');

Автор: Octane, дата: 14 августа, 2008 - 14:05

#permalink

И еще

document.getElementsByTagName("*");

в IE ниже 6-й версии возвращает пустой объект, для этого в старых версиях IE нужно использовать

document.all;















Автор: Bad Request, дата: 26 сентября, 2008 - 16:26

#permalink

Код из раздела "Получить всех потомков" не пашет. Файрбуг пишет:

div is null
1.html()()1.html (line 5)
[Break on this error] var elems = div.getElementsByTagName('*')

Автор: OlexandrI, дата: 31 октября, 2008 - 22:39

#permalink

подскажите, что не то в функции $:

var $my={
	 browser:{
		 version:(userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d|\.]+)/ ) || [])[1],
		 sa:/webkit/.test(userAgent),
		 op:/opera/.test(userAgent),
		 ie:/msie/.test(userAgent) && !/opera/.test(userAgent),
		 mz:/mozilla/.test(userAgent) && !/(compatible|webkit)/.test(userAgent)
		},
	 $:function(elemP, w){
		 w=w||document;
		 var param, id="", elem, get, name;
		 param = /([#|\w|\*]+)\s*(.+)*/i.exec(elemP);
		 if(/#(\w+)/i.test(param[1])){
			 id=/(\w+)/i.exec(param[1])[1];
			 elem=w.getElementById(id);
			}else
		 if(/>(\w+)/i.test(param[1])){
			 name=/(\w+)/i.exec(param[1])[1];
			 elem=w.getElementsByName(name);
			}else
		 if(/([\.|\w]+)/i.test(param[1])){
			 name=/(\w+)/i.exec(param[1])[1];
			 if($my.browser.ie||($my.browser.mz&&$my.browser.version<1.9)
			    ||($my.browser.op&&$my.browser.version<9.5)
				||($my.browser.sa&&$my.browser.version<3.1)){
				 var e;
				 e=$my.$("*", w);
				 elem={};
				 for(var i=0;i<e.length;i++)
					if(e[i].className==name)
						elem[(elem.length)?elem.length:'0']=e[i];
				}else{
				 elem=w.getElementsByClassName(name);
				}
			}else{
			 name=/([\w|\*]+)/i.exec(param[1])[1];
			 if(name=="*"&&$my.browser.ie&&$my.browser.version<6)
				 elem=w.all;
			    else elem=w.getElementsByTagName(name);
			}
		 if(typeof elem=='undefined'){
			 return;
			}
		 if(typeof param[2]!='undefined'&&id){
			 get=/(\w+)/i.exec(param[2])[1];
			 if(/@(\w+)/i.test(param[2]))
				 elem=elem.getAttribute(get);
				else
				 elem=elem[get];
			}
		 return elem;
		}

После визова

<input type="text" class="hh" name="hh" id="u1"></input>
<input type="text" class="hh" name="hh" id="u2"></input>
<script>
test=$my.$(".hh");
</script>

в ІЕ или в Опера 9.24 в test єсть только один елемент?


Автор: EugenyK, дата: 3 ноября, 2008 - 21:19

#permalink

Требуется отыскать все DIV с class='tab' и добавить в них новые DIV'ы с другими классами.

var div = document.getElementsByTagName('div')
	var l = divs.length
	for(var i=0; i<l; i++){
		alert(divs[i].className)
		if(divs[i].className == 'tab'){
			var name = divs[i].innerHTML
			divs[i].innerHTML = "<div class='tab-right'><div class='tab-center'>"+name+"</div></div>"
			divs[i].className = 'tab-left'			
		}
	}

Когда первый if(divs[i].className == 'tab') срабатывает, то после innerHTML, видимо, массив divs меняется и остальные DIV'ы с тем же классом tab найти не получается.

Для этого нужно что ли отдельно сначала заполнить массив удовлетворяющих критерию div'ами, а потом ещё одним циклом их пройти и уже провести операции innerHTML?


Автор: Руслан (не зарегистрирован), дата: 11 мая, 2009 - 18:18

#permalink

Такую особенность заметил, но не нашел подробную информацию, буду рад если разьясните.

Имеется код:

<INPUT type=checkbox id="use0" name="use[0]" value=true>
<INPUT type=text size=10 maxlength=30 name=query_field" onkeyup="checkbox(this,use0);">

имеется скрипт который ставит галку если в поле ввода появлется текст, и убирает если текста нет:

function checkbox(input,check_id) {
    if (input.value == ""){
        check_id.checked = false;
    }else{
        check_id.checked = true;
    }
}

На событие onkeyup я передаю функции checkbox текущий элемент, и элемент checkbox с id="use0" (изначально я его передавал в кавычках и в функции достигал его через getElementById, но случайно понял что если убрать кавычки то будет передаваться элемент со схожим id). Код работает, но не понятно почему элемент с id="use0" доступен из другого элемента таким образом? В Javascript новичок. Спасибо.


Автор: vk (не зарегистрирован), дата: 18 июня, 2009 - 03:04

#permalink

если нужно найти элементы с конкретным классом

// функция поиска элементов по конкретному className
// ищет в т.ч. когда через пробел в тестируемом элементе указано несколько className
// поиск начинается от элемента in_start или document (по умолчанию)
// возвращает массив ссылок на элементы
if(typeof(getElementsByClassName) != "function"){
function getElementsByClassName(in_class,in_start) {
var start_el = in_start || document;
var all_els = start_el.getElementsByTagName("*")
var rez_arr = Array();
for(var i=0; i


Автор: vk (не зарегистрирован), дата: 18 июня, 2009 - 03:09

#permalink

не влезла...

// функция поиска элементов по единичному className
// ищет в т.ч. когда в тестируемом эл-те через пробел указано несколько className
// поиск начинается от элемента in_start или document (по умолчанию)
// возвращает массив ссылок на элементы
function getElementsByClassName(in_class,in_start) {
		var start_el = in_start || document;
		var all_els = start_el.getElementsByTagName("*")
		var rez_arr = Array();
		for(var i=0; i<all_els.length; i++){
			var curr_className = all_els[i].className;
			if(curr_className){
				// если несколько классов, разделенных пробелами
				var atom_class_arr = curr_className.split(/\s+/);
				for(var j=0; j<atom_class_arr.length; j++){
					if(in_class == atom_class_arr[j]){
						rez_arr.push(all_els[i]);
					}
				}// end for(var j=0; j<atom_class_arr.length; j++)
			}
		};// end for(var i=0; i<all_els.length; i++)
		//alert(rez_arr.length);
		return(rez_arr);
	}; // end function getElementsByClassName(in_class)

Автор: Гость (не зарегистрирован), дата: 2 ноября, 2009 - 20:44

#permalink

относительность поиска при вызове getElementsByTagName допускается:

document.getElementsByTagName('DIV')[0].getElementsByTagName('LI')

что очень замечательно, а вот относительности вызова getElementById увы нельзя:

document.getElementsById('blok1').getElementsById('pod_blok3')

getElementsById возможен только из document кто нибудь знает как исправить этот недочёт, чтобы не рекурсивным ручным перебором в отдельном блоке искать элемент с конкретным id, а красивей? Если в другом блоке позади стоящем тоже есть элемент с таким же id, то document.getElementsById(id) не будет правильно определен искомый элемент, т.к. он будет в позади стоящем блоке а не в том где я хочу его найти.


Автор: Гость (не зарегистрирован), дата: 16 ноября, 2009 - 19:07

#permalink

А как выбрать все теги и всё что в них домножить на определенное число?


Автор: Гость (не зарегистрирован), дата: 16 ноября, 2009 - 19:08

#permalink

теги

<td>

Автор: 66 (не зарегистрирован), дата: 8 января, 2010 - 10:04

#permalink

Подскажите пожалуйста.. вот тут пример

<div id="d1">
  <ol id="ol1">
    <li id="li1">1</li>
    <li id="li2">2</li>
  </ol>
</div>
var div = document.getElementById('d1')
var elems = div.getElementsByTagName('*')
 
for(var i=0; i<elems.length; i++) alert(elems[i].id)

Показывает элементы страници.. а мне надо так же.. только элементы странници открываемого окна (дочернего). Тоесть скрип в основном окне, а тэги в дочернем. Но скрипт работает только по родительскому окну. Все перечитал, так и не дошло как сделать, чтобы скрипт вытягивал элементы дочернего окна.. кто знает подскажите..
Идея в том, что моя страничка, должна открывать новое окно с чужой страничкой, с которой мне надо вытянуть некоторые данные.. вот


Автор: Гость (не зарегистрирован), дата: 29 января, 2010 - 08:25

#permalink

Скажите, как проверить, если в теге определённый атрибут или нет?


Автор: Leax, дата: 7 февраля, 2010 - 22:09

#permalink

Из описания document.getElementById непонятно что делать, если элемент не найден. И как обрабатывать такую ситуацию


Автор: Satir (не зарегистрирован), дата: 16 февраля, 2010 - 02:24

#permalink

var firstInput=document.getElementById("i1") // элемент для вставки перед ним
var newDiv1=document.createElement("div") // создание нового элемента для вставки (div)
newDiv1.innerHTML='

Не верное значение

' // значение этого элемента
firstInput.insertBefore(newDiv1,firstInput) // вставка

firebug пишет Node was not found" code: "8 на последней строке, подскажите где я облажался?


Автор: Гость (не зарегистрирован), дата: 4 марта, 2010 - 14:23

#permalink

подскажите как вытащить Id элемента в asp:GridView в случае срабатывания OnClick на данном элементе?


Автор: ValikhanB (не зарегистрирован), дата: 11 мая, 2010 - 17:54

#permalink

вот такая штука:

скрипт

  1. function go()
  2. {
  3. alert(document.getElementsByTagName('li')[1])
  4. }

код html (без <>)

  • input type="button" onclick="go()" value="Go"
  • ul
  • li style="background-color:red" Осторожно /li
  • li class="info" Информация /li
  • ul

выдает такое сообщение - [object HTMLLIElement], в чем ошибка?

Чайник я)


Автор: Гость (не зарегистрирован), дата: 11 июня, 2010 - 20:04

#permalink

почему-то не пашет выражение такого рода
var linka = document.getElementsByTagName("a").getElementsByTagName("img");

опера пишет
Uncaught exception: TypeError: 'document.getElementsByTagName("a").getElementsByTagName' is not a function


Автор: Гость (не зарегистрирован), дата: 11 июня, 2010 - 20:38

#permalink

и такое не пашет тоже
var linka = document.getElementsByTagName('a');
var linka2 = linka.getElementsByTagName('img');

та же ошибка


Автор: Гость (не зарегистрирован), дата: 25 июня, 2010 - 20:45

#permalink

Возможно ли получить доступ к переменной(var) с одного фрейма в другом(напр. с родительского) чтоб можно было ее модифицировать? Если можно, то как это делается? (фреймы все с одного домена)



Автор: Sergej (не зарегистрирован), дата: 9 июля, 2010 - 12:13

#permalink

Насколько я понимаю, ты объявил переменную glob_var1 локально для этой функции. Так глобальную переменную не объявить. Кажется нужно просто написать glob_var1=5; без вар... если не прав не убивайте =)


Автор: Гость (не зарегистрирован), дата: 25 сентября, 2010 - 17:48

#permalink

подскажите,как сделал чтоб кликал по рссунку. сделал так--document.getElementsByTagName/id/tagname("sn_arrow").Click();
но чтото не работает.скрипту только недавно учусь,так что не кричите


Автор: Neznayka (не зарегистрирован), дата: 3 октября, 2010 - 17:12

#permalink

Как ограничить глубину поиска element.getElementsByTagName? Чтобы находил только детей а не всех потомков. Ну или подругому, можно ли выбрать детей определенного типа, не прибегая к условиям?


Автор: Леся (не зарегистрирован), дата: 1 ноября, 2010 - 16:03

#permalink

У меня следующий код:

var ms = document.getElementsByName('formname')[0].getElementsByTagName('*');
alert(ms.length);

в IE выдает 20, а в FF - 0. Подскажите пожалуйста, может я чего-то не так поняла.


Автор: alex_oo7, дата: 3 января, 2011 - 15:05

#permalink

По сути этот скрипт должен показывать название первой аудиозаписи в контакте на странице /audio.php
Но он не работает =(

javascript:
document.write(
document.getElementsByTagName('body')0].
getElementsByTagName('div')[0].
getElementsByTagName('div')[0].
getElementsByTagName('div')[2].
getElementsByTagName('div')[1].
getElementsByTagName('div')[0].
getElementsByTagName('div')[0].
getElementsByTagName('table')[0].
getElementsByTagName('tbody')[0].
getElementsByTagName('tr')[0].
getElementsByTagName('td')[0].
getElementsByTagName('div')[0].
getElementsByTagName('div')[0].
getElementsByTagName('div')[0].
getElementsByTagName('div')[1].
getElementsByTagName('table')[0].
getElementsByTagName('tbody')[0].
getElementsByTagName('tr')[0].
getElementsByTagName('td')[1].
getElementsByTagName('div')[0].
getElementsByTagName('b')[0].
getElementsByTagName('a')[0].value
);

Автор: Адель (не зарегистрирован), дата: 11 января, 2011 - 22:41

#permalink

Логично было бы упомянуть здесь и obj.parentNode - обращение к родителю, для завершенности.


Автор: Гость (не зарегистрирован), дата: 17 марта, 2011 - 13:31

#permalink

Добрый день!

Такой вопрос: как найти в документе элемент id="lightb" и в нём же все теги a. И этом тегам дописать атрибуты rel="lightbox". Событие происходит при загрузки страницы!

Привожу свой пример:

<body>
<script type="text/javascript" language="javascript">
function writerel() {
  var aimg = document.getElementById("lightb").getElementsByTagName("a");
  aimg.setAttribute('rel' ,'lightbox');
  }
</script>
<div id="lightb">
    <a href="#"><img scr="bla bla bla" /></a>
</div>
</body>

Автор: Гость (не зарегистрирован), дата: 10 мая, 2011 - 09:53

#permalink

По идее, этот скрипт должен менять цвет бэкграунда на красный, но почему-то не меняет:

document.getElementsByTagName("body").style.backgroundColor = "#ff0000"

Что я делаю не так?


Автор: Гость (не зарегистрирован), дата: 16 июня, 2011 - 11:34

#permalink

По мне так самые нормальные браузеры это мозила и опера. И то у них свои особенности, благодоря которым мозила лучше всего подходит для создания сайта (поскольку всеядный браузер, 1 версия мозилы понимала стлько тегов и прочее сколько 9 версия оперы и 5 версия ишака), а опера для бродилок по инету (благодаря своей быстроте).


Автор: DODGER (не зарегистрирован), дата: 11 июля, 2011 - 10:04

#permalink

Уже час мучаюсь document.getElementById возвращает null

var timeThen = document.getElementById('timeThen');
timeThen.onclick = function(){
	alert('Ну! Блин!');
}
<div id="content">
	<div id="leftBlock">
		<h1>Занятия <span id="timeNow">сейчас</span> / <span id="timeThen" class="jsAction">потом</span>:</h1>
	</div>
</div>

Почему?


Автор: Mikki Mouse (не зарегистрирован), дата: 23 октября, 2011 - 03:23

#permalink

Учу Javascript, столкнулся с проблемой:

function zIndex(n)
{
  var a=naw Array("containerPriroda","containerSpace","containerIndex_photo");
  var len=a.length;
  for(var i=0; i<len; i++)
  {
     document.getElementById(a[i]).style.zIndex=1;
  }
 document.getElementById(a[n-1]).style.zIndex=2;

}

Почему эта функция не работает?


Автор: m4gz, дата: 7 декабря, 2011 - 00:13

#permalink

Извиняюсь если повтор но вот фикс для IE

onload=function(){
if (document.getElementsByClassName == undefined) { //для IE только т.к. там нету этого
alert('fixing getELEmByClass');
	document.getElementsByClassName = function(className)
{		var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)");
		var allElements = document.getElementsByTagName("*");
		var results = [];
		var element;
		for (var i = 0; (element = allElements[i]) != null; i++) {
			var elementClass = element.className;
			if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass))
				results.push(element);
		}return results;		
	}
}

Автор: golden2020 (не зарегистрирован), дата: 22 декабря, 2011 - 21:10

#permalink

Помогите!!! Как сделать чтобы по URL открывался определенный документ и в нем найти какое то слово (например "Солнце" ). Подробнее: Допустим есть какая та страница html, и она находится по адресу http//:stranica.ru . Как мне со своего документа найти в ней слово "Солнце" и присвоить его переменной sun??? Как это сделать со строкой я знаю , а вот что бы так .....??? Подскажите кто знает чайнику (просто начинаю изучать JavaScript по видео урокам,много не понятно,а спросить не у кого )


Автор: 1klassss (не зарегистрирован), дата: 27 декабря, 2011 - 01:53

#permalink

простите а можно как то осуществить поиск по див если сам див каждый раз меняться??? например

<div id="b2749bbe88c"> а при перезайгрузке уже стает <div id="bc65eb7a7f2">

неособо силен в таких посиках по див, помогите пожалуйста!!


Автор: Zuenf, дата: 27 января, 2012 - 15:21

#permalink

Спасибо))


Автор: MaximLitskevich (не зарегистрирован), дата: 6 февраля, 2012 - 09:48

#permalink

Ребят, нужно по onchange копировать содержимое одного input-а в другой.
страница написана на haml.
Я думаю реализовать это так, но не работает:

%input#email.px300.required.email{ name="email",value=entity.Email,maxlength="100", onchange="javascript: document.getElementById(login).value=document.getElementById(email).value;"}


Автор: kvmutl, дата: 26 августа, 2012 - 10:13

#permalink

я этот вопрос на форуме задавал, а тут целая статья на сайте есть...


Автор: indexcod, дата: 6 ноября, 2012 - 16:26

#permalink

xpath рулит))))))


Автор: Гость (не зарегистрирован), дата: 7 ноября, 2012 - 11:05

#permalink

Молодцы.
"Самый удобный способ найти элемент в DOM - это получить его по id."
А как получить их список? Где взять эти самые Id, если нужно просто пройти по документу?
Ни ссылки, ни комментария...


Автор: Nick123456 (не зарегистрирован), дата: 10 ноября, 2012 - 00:32

#permalink

А если нужен поиск по тэгу не во всём документе, а только в выделенном мышью куске - это возможно ли и как?


Автор: Harm (не зарегистрирован), дата: 24 декабря, 2012 - 22:57

#permalink

всем привет. У меня вопрос. Как искать содержимое в таком код html:

<div class="b">
<div>
Сообщение 1
</div>
<div>
Сообщение 2
</div>
<div>
Сообщение 3
</div>
</div>

Автор: Гость (не зарегистрирован), дата: 8 апреля, 2013 - 20:07

#permalink

Меня до крайности смутило, корректное исполнение кода в 5 разных браузерах.
Это нормально?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
 </HEAD>
 <BODY>
 <div id="test2">Это такой проверочный текст</div>
 	<INPUT TYPE="button" VALUE="нажми меня2" ONCLICK="test2.style.color='blue'">
	<INPUT TYPE="button" VALUE="нажми меня" ONCLICK="alert(test.value)">
	<INPUT TYPE="text" ID="test">
 </BODY>
</HTML>

Автор: Гость (не зарегистрирован), дата: 8 апреля, 2013 - 20:10

#permalink

Меня до крайности смутило, корректное исполнение кода в 5 разных браузерах.
Это нормально?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
	<HEAD>
		<TITLE> New Document </TITLE>
	</HEAD>
	<BODY>
		<DIV id="test2">Это такой проверочный текст</DIV>
		<INPUT TYPE="button" VALUE="нажми меня2" ONCLICK="test2.style.color='blue'">
		<INPUT TYPE="button" VALUE="нажми меня" ONCLICK="alert(test.value)">
		<INPUT TYPE="text" ID="test">
	</BODY>
</HTML>

Автор: tsigel, дата: 12 августа, 2013 - 14:19

#permalink

Не плохо было бы добавить информацию о querySelector и querySelectorAll так как это поддерживают почти все браузеры.

http://www.codeisart.ru/w3c-css-selectors-api-the-queryselector-and-quer...


Автор: Руслан1993 (не зарегистрирован), дата: 22 ноября, 2013 - 19:55

#permalink

а как реализовать такой алгоритм:
к 2ум страницам штмл "штмл1" и "штмл2" подключён один и тот же js и в нём код, который должен делать:
выборка элемента с штмл1 на него событие клик,а действие которое должно происходить применяется на элемент в штмл2, но нечего не работает, что сделать?


Автор: golden2020, дата: 26 ноября, 2013 - 00:57

#permalink

Подскажите пожалуйста:
Вот допустим есть некий DIV с id="d2". В этом блоке находятся ссылки с неким class="c1". Как найти все ссылки которые находятся в этом блоке?

<div id="d2">
  <a class="c1" href="#1">
  <a class="c1" href="#2">
  <a class="c1" href="#3">
</div>

Нужно вытянуть ссылки (значение href);

Заранее спасибо всем тем кто откликнется!!!


Автор: Антон1632 (не зарегистрирован), дата: 1 сентября, 2014 - 11:12

#permalink

Здравствуйте.
Подскажите пожалуйста. Нужно для ссылок в параграфе (p) применить класс "lightbox"
Использую пока такой код:
var els = document.getElementsByTagName('a');
for (var i = 0; i < els.length; i++)
els[i].setAttribute('class', 'lightbox');

но он применяет этот класс ко всем ссылкам в документе. Пробовал сделать как написано в статье — не получилось.
Помогите разобраться.


Автор: Skvor, дата: 27 октября, 2014 - 21:03

#permalink

А что будет, если скопировать(клонировать) узел, который содержит ID?
В копии не д.б. ID или всё-таки ID станет не уникальным?


Автор: Гость (не зарегистрирован), дата: 14 ноября, 2015 - 18:10

#permalink

Помогите, пожалуйста!
Программа находит все ссылки, которые есть в div, и выводит их URL- адреса, но они не активны, как сделать, чтобы он выводил все адреса и по ним ещё можно было перейти. Я думаю проблема в выводе:

document.write('<a>'+ giper[i]+'<br>'+'</a>');

код:

<body>
<div id="bot">
//куча ссылок
</div>
<script type="text/javascript" language="javascript">
function gripon()
{
var giper = document.getElementById('bot').getElementsByTagName('a');
    for (var i = 0; i < giper.length; i++) {
		document.write('<a>'+ giper[i]+'<br>'+'</a>');
                                                       }
}
gripon();
</script>
</body>

Автор: Гость (не зарегистрирован), дата: 21 ноября, 2015 - 19:18

#permalink

[quote]
document.write(''+giper[i]+'');
Когда я подставляю в вывод хрев, то переход осуществляется наверх страницы, если нажать на любой адрес. Я вот, что думаю может, есть какой-то атрибут, который передает все адреса. Если такого нет, то очень грустно. Сколько гуглив я ничего все равно не нашел.
Это лабораторная в ВУЗе, поэтому приходится использовать document.write
[/quote]
"хрев", как вы выразились, который, конечно, даже по самым невразумительным правилам транскрибирования - всё же "хреф", является сокращением от "Hypertext REFerence" - что в переводе с английского означает "гипертекстовая отсылка", что в свою очередь намекает что именно в этом параметре должен быть указан адрес перехода...
И эта инфа свободно доступна по первой же ссылке в выдаче гугла по запросу "href" или "html a".

З.Ы. с такими навыками поиска информации в ВУЗ не было смысла идти - стоило сразу после 9го класса идти работать грузчиком - КПД выше был бы.


Автор: Гость (не зарегистрирован), дата: 7 марта, 2017 - 17:58

#permalink

Выше хрома 41 жизни нет.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Название документа</title>
  <script type="text/javascript">
function count(t)
{
    var y = document.getElementById("para1");
    c=Number(y.innerHTML);
    c += Number(t);
    y.innerHTML=c;
}
  </script>
</head>
<body>
  <p id="para1">0</p>
  <button onclick="count('1')">+1</button>
  <button onclick="count('-1')">-1</button>
</body>
</html>

Автор: carinamon (не зарегистрирован), дата: 1 августа, 2023 - 11:48

#permalink

Этот метод позволяет получить элемент по его уникальному идентификатору Immaculate Grid. Идентификатор должен быть уникальным на странице.


Автор: Aqel (не зарегистрирован), дата: 17 октября, 2023 - 10:49

#permalink

Ребята подскажите советом (в JS не разбираюсь ещё):
Есть в вэб-странице код:

<div id="mep_0" class="mejs-container svg"
...
<video id="video-flash"  
...
url2="тут нужная мне ссылка"
...>

Мне нужно ссылку из url2 получить, просто хотя бы в конце страницы высвечивалась или как нить в окне что бы показывалась?
Не пинайте сильно. СпС.


 
Текущий раздел
Поиск по сайту
Содержание

Дерево всех статей

Последние темы на форуме
Forum