Question

我有以下要解析的html代码（一些元素被剥离以增强可读性）：

</div>
            <article class="article-detail-description">
                <h1 class="page-heading">
                    Postulat operacyjności definicji w naukach społecznych
                    <br /><small>Definition’s Operativeness Postulate in Social Sciences</small>
                </h1>

                <div>
                    <strong>Author(s): </strong>Jakub Karpiński<br /><strong>Subject(s): </strong>Social Sciences<br /><strong>Published by: </strong>Instytut Filozofii i Socjologii Polskiej Akademii Nauk<br/><strong>Keywords: </strong>operationism; definition of property; definition of indicator;  concepts selection
<br/>
                </div>
                  <p class="summary"><strong>Summary/Abstract: </strong> 
The article’s primary goal is to demonstrate the problems inherited in “operationism – antioperationism” polemics.
</p>
                <ul class="nav nav-tabs">
                    <li class="active" ><a href="#details" data-toggle="tab">Details</a></li>

                    <li><a href="#tableOfContents" data-toggle="tab">Contents</a></li>

                </ul>
                <div class="tab-content">
                    <div class="tab-pane fade active in" id="details">
                        <p class="journal-link"><strong>Journal: </strong><a href="/search/journal-detail?id=10">Studia Socjologiczne</a></p>   
                        <ul class="article-additional-info">
                            <li><strong>Issue Year:</strong> 2011</li><li><strong>Issue No:</strong> 1 (200)</li><li><strong>Page Range:</strong> 65-80</li><li><strong>Page Count:</strong> 15</li><li><strong>Language:</strong> Polish</li>
                        </ul>
                    </div>

我可以使用

阅读所有内容

document.getElementsByClassName("article-detail-description")[0].textContent。

只读<p class="summary"我使用：

getElementsByClassName("summary")[0].textContent

然而，后者并不完美，因为它也显示Summary/Abstract:）

我对许多元素感兴趣，让我们以下面的例子为例：

1 即可。 Postulatopenracyjnościdefinicjiwnaukachspołecznych

我可以得到：

Postulat operacyjności definicji w naukach społecznych
Definition’s Operativeness Postulate in Social Sciences

为了得到它，我使用：document.getElementsByClassName("page-heading")[0].innerText

如何单独Postulat operacyjności definicji w naukach społecznych和Definition’s Operativeness Postulate in Social Sciences？

2 即可。我想得到例如2011来自：

`<li><strong>Issue Year:</strong> 2011</li><li>`

这次我不知道如何获取这些信息。 Issue No:和其他人也是如此。

Answer 1

取决于结构是否稳定;但你可以访问文本节点：

var heading = document.getElementsByClassName('page-heading')[0];
var polish = heading.childNodes[0].textContent.trim();
var english = heading.childNodes[2].textContent.trim();
console.log("Polish:", polish);
console.log("English:", english);

var li = document.querySelector('.article-additional-info li');
var issueYear = li.childNodes[1].textContent.trim();
console.log("Issue Year:", issueYear);

</div>
            <article class="article-detail-description">
                <h1 class="page-heading">
                    Postulat operacyjności definicji w naukach społecznych
                    <br /><small>Definition’s Operativeness Postulate in Social Sciences</small>
                </h1>

                <div>
                    <strong>Author(s): </strong>Jakub Karpiński<br /><strong>Subject(s): </strong>Social Sciences<br /><strong>Published by: </strong>Instytut Filozofii i Socjologii Polskiej Akademii Nauk<br/><strong>Keywords: </strong>operationism; definition of property; definition of indicator;  concepts selection
<br/>
                </div>
                  <p class="summary"><strong>Summary/Abstract: </strong> 
The article’s primary goal is to demonstrate the problems inherited in “operationism – antioperationism” polemics.
</p>
                <ul class="nav nav-tabs">
                    <li class="active" ><a href="#details" data-toggle="tab">Details</a></li>

                    <li><a href="#tableOfContents" data-toggle="tab">Contents</a></li>

                </ul>
                <div class="tab-content">
                    <div class="tab-pane fade active in" id="details">
                        <p class="journal-link"><strong>Journal: </strong><a href="/search/journal-detail?id=10">Studia Socjologiczne</a></p>   
                        <ul class="article-additional-info">
                            <li><strong>Issue Year:</strong> 2011</li><li><strong>Issue No:</strong> 1 (200)</li><li><strong>Page Range:</strong> 65-80</li><li><strong>Page Count:</strong> 15</li><li><strong>Language:</strong> Polish</li>
                        </ul>
                    </div>

如何解析结构不合理的HTML代码？

1 个答案: