Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.08.2017, 17:46
Новичок на форуме
Отправить личное сообщение для kazanova84 Посмотреть профиль Найти все сообщения от kazanova84
 
Регистрация: 09.08.2017
Сообщений: 7

find включая self со сложным селектором
Всем доброго времени суток!

Воткнулся в тупик, не могу решить, как лучше сделать. Есть произвольный jquery-селектор, хранящийся в переменной. В документ добавляется некий объект. В этом объекте (контексте) надо найти все элементы, удовлетворяющие селектору, включая сам объект. Иными словами, нужен метод, такой же как find, только включающий в зону поиска исходный объект (контекст), а не только его дочерние элементы.

Поиск по интернету дал такое решение:
var target = $(context).find(selector).addBack(selector);

Но оно не работает для сложных селекторов. Например, если
selector = "#container a";
а context вот такой:
<div id="container"><a href="">link</a></div>

то решение не сработает, на выходе будет пусто. Почему - понять не сложно. find ищет только среди дочерних к context элементов, а addBack берет исходный элемент (context) и фильтрует по селектору, не залезая вглубь дерева. Как элегантно решить - не могу сообразить Структуру документа менять нельзя (т.е. обернуть context в дополнительный div не катит). Взять родительский элемент - тоже, т.к. а) его может не быть, если context = document; б) можно найти лишнее, не относящееся к context. Помогите, плз. Вроде простая задача, а простого решения не вижу
Ответить с цитированием
  #2 (permalink)  
Старый 09.08.2017, 18:09
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от kazanova84
а context вот такой:
странный контекст, либо селектор не правильный
Ответить с цитированием
  #3 (permalink)  
Старый 09.08.2017, 18:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

kazanova84,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
var context = "#container", selector = "a";
var target = $(selector,context).addBack();
alert($.map(target,function(el) {
return el.tagName
}));
});
  </script>
</head>

<body>
<div id="container"><a href="">link</a></div>
</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 09.08.2017, 18:26
Новичок на форуме
Отправить личное сообщение для kazanova84 Посмотреть профиль Найти все сообщения от kazanova84
 
Регистрация: 09.08.2017
Сообщений: 7

Сообщение от рони Посмотреть сообщение
странный контекст, либо селектор не правильный
Это просто пример. Контекст и селектор могут быть условно произвольными. Вот другой пример: https://jsfiddle.net/7mp46of0/6/
Ответить с цитированием
  #5 (permalink)  
Старый 09.08.2017, 18:28
Новичок на форуме
Отправить личное сообщение для kazanova84 Посмотреть профиль Найти все сообщения от kazanova84
 
Регистрация: 09.08.2017
Сообщений: 7

рони,
Селектор хранится в переменной, и что он из себя представляет - нам не известно. Обработать мы его можем, но вот так легко "располовинить" - нет.
Ответить с цитированием
  #6 (permalink)  
Старый 09.08.2017, 18:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от kazanova84
Вот другой пример:
нет таблицы в таблице,

нет id в id в первом сообщении.

Сообщение от рони
странный контекст, либо селектор не правильный
Ответить с цитированием
  #7 (permalink)  
Старый 09.08.2017, 18:33
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

... но выход найдётся
Ответить с цитированием
  #8 (permalink)  
Старый 09.08.2017, 19:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

kazanova84,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
var context = "#context", selector = "table a";
var target = $(selector).filter(function(i,el) {
return $(context).find(el).length
}).add(context);

alert($.map(target,function(el) {
return el.tagName
}));
});
  </script>
</head>

<body>
<div id="body">
  <table id="context">
    <tr>
      <td><a>target</a></td>
    </tr>
  </table>
</div>

<div id="body">
  <table id="test">
    <tr>
      <td><a>target</a></td>
    </tr>
  </table>
</div>
</body>
</html>
Ответить с цитированием
  #9 (permalink)  
Старый 09.08.2017, 19:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

kazanova84,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
var context = "#container", selector = "#container a";
var target = $(selector).filter(function(i,el) {
return $(context).has(el).length
}).add(context);

alert($.map(target,function(el) {
return el.tagName
}));
});
  </script>
</head>

<body>
<div id="container"><a href="">link</a></div>
<div id="test"><a href="">link</a></div>
</body>
</html>

Последний раз редактировалось рони, 09.08.2017 в 19:10.
Ответить с цитированием
  #10 (permalink)  
Старый 10.08.2017, 01:17
Аватар для Белый шум
Профессор
Отправить личное сообщение для Белый шум Посмотреть профиль Найти все сообщения от Белый шум
 
Регистрация: 19.01.2012
Сообщений: 498

var s = $(selector);
var res = $(context).find(s).addBack();

https://jsfiddle.net/0jbq9pbe/
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jquery. Метод find Анатолий Саратовцев Events/DOM/Window 4 29.06.2012 09:23