Javascript, как получить доступ к элементам из HTML-файла, загруженного с помощью jQuery

Javascript, как получить доступ к элементам из HTML-файла, загруженного с помощью jQuery

Меня интересует, как получить доступ к элементам HTML из «внешнего файла HTML», который встроен в «основной файл HTML» (встраивание было сделано с использованием jQuery) с помощью javascript (который является частью «основного файла HTML»).

jsfiddle : https://jsfiddle.net/King_Fish/bfzqjw38/5/

Позвольте мне привести мой пример: у меня есть страница, сохраненная как PlantCard.html (это «внешний HTML-файл»). Затем в Main.html («основной файл HTML») я создал 4 div и загрузил PlantCard.html в них с помощью JavaScript. Это вложение было сделано следующим образом:

 var plantCardIds = ["#test", "#test1", "#test2"]; $(document).ready(function() { loadPlantCards(); }); function loadPlantCards() { var plantInfo = plantCardsInfoLoader(); var i; for(i = 0; i {amp}lt; plantInfo.length; i  ) { $(plantCardIds[i]).load("PlantCard.html"); /*I want to access and change the elements of "PlantCard.html" HERE!*/ } } 

Функция loadPlantCards() загружает все «карточки растений» (контейнеры с информацией о конкретных растениях) путем plantCardIds массива plantCardIds (содержит идентификаторы PlantCard.html в которые должен быть загружен PlantCard.html .

Тем не менее, я хочу, чтобы на каждой «карточке растения» отображалась различная информация, а также разные изображения растения. Поэтому я должен получить доступ к элементам внутри PlantCard.html , и здесь есть проблема. До сих пор я пытался добиться желаемого эффекта следующим образом:

 function loadPlantCards() { console.log("Loading plants..."); var plantInfo = plantCardsInfoLoader(); var i; for(i = 0; i {amp}lt; plantInfo.length; i  ) { $(plantCardIds[i]).load("PlantCard.html"); $(plantCardIds[i]).getElementById("plant_name").innerHTML=plantInfo[i].plantName; } } 

Тем не менее, при использовании этой строки кода ( $(plantCardIds[i]).getElementById("plant_name").innerHTML=plantInfo[i].plantName; ) для доступа к html внутри соответствующего div, который должен содержать «карточку завода» Я приветствую это исключение:

 Uncaught TypeError: $(...).getElementById is not a function 

Теперь я был бы очень рад, если бы кто-то объяснил, как получить доступ к элементам HTML со страницы, которая встроена в div .

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector