我不能使用jQuery庫，我越來越TypeError：document.getElementById（...）爲'純翻譯'爲純javascript時爲空

我不能在我的項目上使用jQuery庫，所以我需要得到這個jQuery的小片段，以「純」 javscript我不能使用jQuery庫，我越來越TypeError：document.getElementById（...）爲'純翻譯'爲純javascript時爲空

$(document).ready(function(){ 
$listHeight = $('ul#home-news-list').height(); 
$child = $('ul#home-news-list li:last-child'); 
while ($listHeight > 150) { 
    $($child).remove(); 
    $listHeight = $('#home-news-inner ul').height(); 
    $child = $('ul#home-news-list li:last-child'); 
    console.log($listHeight); 
    } 
});

因此，它基本上消除了最後一個列表項，直到列表高度小於150我的JavaScript技能並不好，所以這是我想出了這個代碼，它給我TypeError: document.getElementById(...) is null在第一行，所以我不知道如果其餘的東西是值得的任何東西：

var listHeight = document.getElementById('home-news-list').offsetHeight(); 
var child = document.getElementById('home-news-list li:last-child'); 
while (listHeight > 150) { 
    child.parentNode.removeChild(child); 
    var listHeight = document.getElementById('home-news-list').offsetHeight(); 
    child = document.getElementById('home-news-list li:last-child'); 
}

你能告訴我我的代碼有什麼問題嗎？

我打電話這個腳本<head></head>

來源

2013-06-20 Bojana Šekeljić

我爲你不被允許使用jQuery感到遺憾，並希望你在允許的地方找到更好的工作。 – Renan

你在哪裏把你的JavaScript代碼的'純'版本？ jQuery代碼運行在'document.ready'函數中，鉤住了window.load。您的代碼是否在DOM渲染之前運行？ – Paddy

不確定，但我建議把腳本標籤放在body標籤的末尾並嘗試一次 –

如果你想使用CSS選擇像jQuery不會那麼你可以使用JavaScript的querySelector和querySelectorAll方法。

var listHeight = document.getElementById('home-news-list').offsetHeight(); 
var child = document.querySelector('home-news-list li:last-child'); 
while (listHeight > 150) { 
    child.parentNode.removeChild(child); 
    var listHeight = document.getElementById('home-news-list').offsetHeight(); 
    child = document.querySelector('home-news-list li:last-child'); 
}

這是一樣的，你的代碼，但與querySelector時getElementByid不起作用取代。

來源

2013-06-20 20:08:08

你的主要問題似乎是使用的getElementById的，調用此方法不能用相同的參數JQuery的使用，因此成爲cubersome和PUR內更詳細的JavaScript ，還的offsetHeight是一個屬性，而不是一個方法：

var listHeight = document.getElementById('home-news-list').offsetHeight; 
var parent = document.getElementById('home-news-list'); 
var child = parent.lastChild; 
while (listHeight > 150) { 
    child.parentNode.removeChild(child); 
    listHeight = document.getElementById('home-news-list').offsetHeight; 
    child = parent.lastChild; 
}

來源

2013-06-20 20:02:51 Sparko

首先，您的腳本<head>將在瀏覽器有機會解析您的DOM之前立即執行;所以你應該把頁面的底部腳本，並確保執行腳本只有當DOM準備就緒：

window.onload = function() { 
    ... 
};

如果你改變的offsetHeight（）來的offsetHeight第一行應該工作（這是一個屬性，而不是方法）。對於剩下的，你需要挖掘CSS選擇器和DOM api來弄清楚jQuery如何去做...

對不起，你不能使用jQuery，DOM API是一個可怕的怪物。

來源

2013-06-20 20:13:22

我不能使用jQuery庫，我越來越TypeError：document.getElementById（...）爲'純翻譯'爲純javascript時爲空

回答

相關問題