我已經開始使用 javascript 進行前端開發,我正在嘗試使用自定義 js 代碼更改 Moodle 課程中的圖示,但我無法定位它。我試圖從一個已知的起點(我創建了一個帶有 id 的跨度)導航到那里,然后想要上升 4 步并使用 find() 抓取影像。但我似乎根本不能針對祖祖父母的任何孩子。
我在使用下面的代碼之前加載了 jquery,當然整個 Moodle 站點還有更多代碼。
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<li class="activity hvp modtype_hvp " id="module-1083815">
<div id="yui_3_17_2_1_1637060405097_363">
<div class="mod-indent-outer w-100" id="yui_3_17_2_1_1637060405097_362">
<div class="mod-indent">
</div>
<div id="yui_3_17_2_1_1637060405097_361">
<div class="activityinstance">
<a class="aalink dimmed" onclick="" href="https://moodle.htw-berlin.de/mod/hvp/view.php?id=1083815">
<!-- I want to change this image -->
<img src="https://moodle.htw-berlin.de/theme/image.php/boost_campus/hvp/1636530372/icon" class="iconlarge activityicon" alt="" role="presentation" aria-hidden="true">
<span class="instancename">Business Proficiency - Telephoning
<span class="accesshide "> Interactive Content</span>
</span>
</a>
</div>
<div class="contentafterlink dimmed_text" id="yui_3_17_2_1_1637060405097_360">
<div class="no-overflow" id="yui_3_17_2_1_1637060405097_359">
<div class="no-overflow" id="yui_3_17_2_1_1637060405097_358">
<script type="text/javascript">
document.write("<span id='targetchild101'>findmyparent</span><br>");
document.write($("#targetchild101").parents()[3].tagName);
<!-- I can't target children() or find() children from the parent -->
$("#targetchild101").parents()[3].find("img").src = "https://moodle.htw-berlin.de/theme/image.php/boost_campus/forum/1636530372/icon";
</script>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
我的主要問題是:如何定位祖父母的孫子影像以更改其來源。我收到錯誤“Uncaught TypeError: $(...).parents(...)[3].find is not a function”那么我該怎么做才能找到父母的孩子而不是使用父母( )[3]?
我的問題是:有沒有比創建一個帶有 id 的空跨度更復雜的方法來獲取參考點?類似于 $(document).current 函式?
uj5u.com熱心網友回復:
您需要再次將 HTML 元素轉換為 jquery。正如你的例子: $(...).parents(...)[3] 需要是 $($(...).parents(...)[3]) 然后呼叫find。
uj5u.com熱心網友回復:
有很多方法可以定位影像或任何元素,如果您想在不使用任何父選擇器或其他選擇器的情況下更改此特定影像,則可以通過其原始src屬性進行選擇。
這可能不是人們應該這樣做的方式,......
$('#yui_3_17_2_1_1637060405097_361 img').attr('src','https://moodle.htw-berlin.de/theme/image.php/boost_campus/forum/1636530372/icon');
//$('img[src="https://moodle.htw-berlin.de/theme/image.php/boost_campus/hvp/1636530372/icon"]').attr('src','https://moodle.htw-berlin.de/theme/image.php/boost_campus/forum/1636530372/icon');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<li class="activity hvp modtype_hvp " id="module-1083815">
<div id="yui_3_17_2_1_1637060405097_363">
<div class="mod-indent-outer w-100" id="yui_3_17_2_1_1637060405097_362">
<div class="mod-indent">
</div>
<div id="yui_3_17_2_1_1637060405097_361">
<div class="activityinstance">
<a class="aalink dimmed" onclick="" href="https://moodle.htw-berlin.de/mod/hvp/view.php?id=1083815">
<!-- I want to change this image -->
<img src="https://moodle.htw-berlin.de/theme/image.php/boost_campus/hvp/1636530372/icon" class="iconlarge activityicon" alt="" role="presentation" aria-hidden="true">
<span class="instancename">Business Proficiency - Telephoning
<span class="accesshide "> Interactive Content</span>
</span>
</a>
</div>
<div class="contentafterlink dimmed_text" id="yui_3_17_2_1_1637060405097_360">
<div class="no-overflow" id="yui_3_17_2_1_1637060405097_359">
<div class="no-overflow" id="yui_3_17_2_1_1637060405097_358">
</div>
</div>
</div>
</div>
</div>
</div>
</li>
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/357452.html
標籤:javascript html 查询 穆德尔
