s 獲取頁面中的script標簽,這是網上的一段代碼,經測試,可以獲取。
var child = document.children;
var arr = [];//用來存放獲取到的所有的標簽
function fn(obj) {
for (var i = 0; i < obj.length; i++) {
if (obj[i].children) {//當當前元素還存在子元素的時候,遞歸
fn(obj[i].children);
}
arr.push(obj[i]); //遍歷到的元素添加到arr這個數組中間
}
}
fn(child);
console.log(arr);//打印出最后獲取到的結果
for (var i = (arr.length - 1); i >= 0; i--) {
console.log(arr[i]);
}
其實,這段JavaScript代碼的主要目的是獲取當前頁面中的所有DOM元素,包括script標簽,并將它們存儲在一個數組中。然而,它實際上并沒有針對script標簽進行特殊處理,而是獲取了document.children的所有直接子元素及其子孫元素。
如果要專門獲取頁面中的所有script標簽,我們可以稍微修改一下這段代碼:
var arr = [];
function collectScripts(obj) {
for (var i = 0; i < obj.length; i++) {
if (obj[i].nodeName === 'SCRIPT') { // 當前元素為script標簽時
arr.push(obj[i]);
}
if (obj[i].children && obj[i].children.length > 0) {
collectScripts(obj[i].children); // 如果當前元素還存在子元素,則遞歸查找
}
}
}
// 遍歷整個文檔對象模型以查找script標簽
collectScripts(document.getElementsByTagName('html')[0].children);
console.log(arr); // 打印出所有找到的script標簽
for (var i = (arr.length - 1); i >= 0; i--) {
console.log(arr[i]);
}
看結果:
這里,我們首先通過document.getElementsByTagName('html')[0].children來獲取HTML文檔的頂層子元素,然后在遍歷過程中檢查每個元素是否是script標簽,如果是則將其添加到數組arr中。同時保留了原有的遞歸結構,以便能夠捕獲嵌套在其他標簽內的script標簽。非常完美的實現了獲取頁面中的script標簽。你也可以復制到瀏覽器的控制臺試試。非常好用!
一天,老板不滿地說:“喂,你這C#爬蟲怎么連標題都沒給我抓回來?我需要的是一份完整的報告,包括所有網頁的標題,趕緊給我重新抓一遍!”那一刻,我仿佛看到了老板眼中閃爍的怒火,感受到了他對我工作的失望。
我仿佛看到了老板眼中閃爍的怒火,就像是火山即將爆發前的預兆。我心里咯噔一下,知道這次可能玩大了。
我趕緊賠著笑臉說:“老板,真不好意思,這次是我的失誤。我馬上就去給您抓回那些‘逃跑’的標題!”
其實我心里暗笑,因為那些標題我早就抓回來了,只是故意沒展示出來。這可是職場生存法則啊,不能一次交出所有秘密,得留點懸念,讓老板對你始終保持期待和好奇。你覺得這樣做對嗎?歡迎討論,哈哈!
代碼其實很簡單:
// 使用XPath查詢獲取title標簽
HtmlNode titleNode = doc.DocumentNode.SelectSingleNode("//title");
//這行代碼是使用C#的HtmlAgilityPack庫來從HTML文檔中提取<title>標簽的內容。
//目的是從doc表示的HTML文檔中選擇第一個<title>標簽,并將這個標簽的節點對象賦值給titleNode變量。
如果要獲取<title>標簽中的文本內容,這樣寫:
string titleText = titleNode?.InnerText;
這里,?.是一個null條件運算符,如果titleNode為null(也就是說沒有找到<title>標簽),
則titleText會被賦值為null,否則,它會被賦值為<title>標簽中的文本內容。
這個代碼是怎么使用的呢?下面我解釋下實現過程:
static string? ParseTitleData(string htmlContent)
{
if (string.IsNullOrEmpty(htmlContent))
{
return null;
}
HtmlDocument doc = new HtmlDocument();
doc.LoadHtml(htmlContent);
// 使用XPath查詢獲取title標簽
HtmlNode titleNode = doc.DocumentNode.SelectSingleNode("//title");
if (titleNode != null)
{
// 獲取title節點的文本內容
string titleText = titleNode.InnerText.Trim();
return "頁面標題: " + titleText;
}
else
{
// 如果沒有找到title標簽,返回null
return null;
}
}
//這段代碼定義了一個名為 ParseTitleData 的靜態方法,
//它接受一個 htmlContent 字符串作為輸入,并試圖從中解析出網頁的標題。
//該方法使用 HtmlAgilityPack 庫來解析 HTML 內容。
是不是很簡單?這個方法的目的是從給定的 HTML 內容中提取網頁的標題。如果成功找到標題,它會返回一個包含 "頁面標題: " 和實際標題的字符串。如果 HTML 內容為空、null 或不包含 <title> 標簽,它會返回 null。
看效果:
完整代碼是包括如何異步獲取網頁內容的。如果有朋友需要的話,請關注我并留言,今天就寫到這吧,太晚了,休息啦!
.情況
當我們使用js解析Html文檔的時候,經常需要獲取某個元素下的子節點 , 這時我們會發現, 我們獲取到的節點數量跟我們實際在頁面中看到的好像不太一樣
<ol> <li>魔獸爭霸</li> <li>反恐精英</li> <li>紅色警戒</li> </ol>
比如上面這段代碼, 我們明明看到的只有三個子項, 可是有時在遍歷的時候會出現不是三個子項的情況
2.原因
節點
<ol>(text)<li>魔獸爭霸</li>(text)</ol>
元素
<ol><li>魔獸爭霸</li></ol>
兩個標簽中的中間隔的部分都是節點 , text 和 element都是節點
下面這段代碼中, ol 開始標簽到 li 開始標簽中間的這部分我們就稱之為text節點
li 開始標簽到 li 接收標簽這部分我們稱之為element節點
由開始標簽和結束標簽組成的部分
下面這段代碼中, ol 開始標簽和 ol 結束標簽組成的一組我們稱之為一個元素 , li 開始標簽和 li 結束標簽組成的一組也稱之為是一個標簽
在所有的dom結構中,子項分為兩種
所以, 上面的上面的代碼中, ol 元素下有三個節點 , 一個元素
3.解決辦法
js為每個元素提供了兩個屬性
childNodes : 獲取所有的子節點
children : 獲取所有的子元素
*請認真填寫需求信息,我們會在24小時內與您取得聯系。