javascript - 提取给定 HTML block 中的所有 CSS 类和 ID

标签 javascript jquery html css regex

我有一个文本区域,我可以在其中粘贴一段 HTML 代码。当我点击提交时,我想从该 block 中提取所有 CSS 类和 ID,并将它们放入一个数组中。

到目前为止,我的提交和正则表达式都在工作,但我不知道如何过滤整个 block 并提取文本与我的正则表达式匹配的所有实例。

index.html

<body>
    <textarea id="codeInput"></textarea>
    <button id="submitCode">submit</button>
    <script src="functions.js"></script>
</body>

函数.js

$(function() {
    $('#submitCode').click(function() {
        var codeInput = $('textarea#codeInput').val();
        console.log(codeInput);
    });
});

最佳答案

$('#submitCode').click(function() {
    var codeInput = $('textarea#codeInput').val();
    var codeHTML = $('<div>', { html: codeInput }); // Parse the input as HTML
    var allIds = [];
    var allClasses = [];
    codeHTML.find('[id]').each(function() {
        allIds.push(this.id);
    });
    codeHTML.find('[class]').each(function() {
        allClasses = allClasses.concat(this.className.split(' '));
    });
    console.log("IDs: " + allIds.join(', '));
    console.log("Classes: " + allClasses.join(', '));
});

关于javascript - 提取给定 HTML block 中的所有 CSS 类和 ID,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23300275/

相关文章:

javascript - 检查 Chrome 扩展程序中加载的页面

javascript - 2014 年 RequireJS 与 Backbone、Underscore 和 jQuery 的依赖关系

javascript - 使用 jQuery 更改元 facebook og

javascript - 如何从 DropDown 中选定的选项获取标题属性的值

html - 使用 ':nth-of-type' 一起选择所有子元素,而不是单独选择

javascript - Semantic-ui:无法调用复选框 onDisable 函数

javascript - Selenium DOM 定位器的语义如何工作?

javascript - 通过 d3 v5 Promise 加载时如何引用第二个数据集中的数据?

javascript - 停止内容在粘性 div 下占用空间

javascript - 使用 Javascript chop 所有字符串