前几天我发现了一个功能惊人的网站。
令人惊奇的是，搜索会立即返回有关按键事件的 youtube 提示。
答案似乎很明显—— YouTube API v3。
但！API 有配额限制，网站上的流量为 400 万/月。
因此，配额早就消失了。
问题#1：你怎么能得到这样的提示？
续集更耐人寻味。
毕竟，通过发送搜索请求 - 您可以获得即时结果。
结果的显示速度比 YouTube 本身更快。
（当然，很明显 YouTube 加载的脚本会减慢页面速度，但仍然如此）
问题 #2：如何从 YouTube 获取搜索结果？
您可以在网站上查看示例。https://getmp3.pro/
在音乐网站上创建付费订阅的过程中，我们遇到了一个问题：
Google bot 将如何（在抓取页面时）对使用 css 的隐藏内容做出反应？
页面截图：
使用 CSS 隐藏内容
filter: blur();
user-select: none;
逻辑结论：
bot贯穿页面的HTML代码。
而且由于内容本身就在那里，所以不应该出现问题。
但真的是这样吗？
向计算机背后的人类问好！
有一个在线电影院，我们要在其上实现该功能：
观看电影后，您返回主页（所有电影的列表）并查看您已经看过哪些电影（更改样式）。同时，cookie 只会在出现在电影页面 5 分钟后才被记录下来，这样就有时间挥霍，不会将所有打开和立即关闭的电影都添加到“已观看”的电影中。
当然，对于这项任务，cookie 对我们很有用。
但是由于将有数百部电影观看，在某些情况下如果不是数千部电影。这就提出了一个问题：“如何写下并获得一系列 cookie？”
您需要知道标签中页面上显示的图像的权重<img>
控制台中的所有内容都可用，但是如何将其拉入变量中？
UPD：图像权重 (Kb) = 文件大小
你好！Selenium.WebDriver使用(element not dynamic)拉动 YouTube 视频页面上的 h1 元素
//--- открываем ссылку
driver.Url = videoInfo.sourceUri.ToString();
//--- title - название песни
IWebElement elementH1 = FindElementByTagName(driver, "h1", out infoMessage);
但与此同时，结果会随着时间而来。也就是说，它找到它一次，如果它没有找到它，它可以找到它 5 次，它再次没有。无法确定异常算法。谁有这样的东西？
另外，我尝试设置延迟2秒，结果是一样的：
//--- задержка
driver.Manage().Timeouts().ImplicitWait = TimeSpan.FromSeconds(2);
网站上的代码结果：eproves.com （因为不能留下链接）
有一个任务：当您将鼠标悬停在一个对象上时，将光标更改为grabbing。
释放后 - 将光标更改回标准位置。
我有这个代码jQuery：
$(function () {
$('.swiper-container').on('mousedown', function() {
console.log(1);
});
});事实证明，当您按住鼠标右键时，它会起作用。
当夹在车轮上时 - 它也可以工作。但是当你按住鼠标左键 - 它不起作用。
在浏览器中测试网站Chrome 86.0.4240.111
同样的行为也适用于笔记本电脑上的触摸板。
任务：解析 YouTube 上动态加载的块（在 ID 为 #collapsible 的描述下的许可证块）。页面的初始 DOM 由编码脚本组成，因此 PHP 看不到所需的元素。只有在完全处理完 JS 后，才会加载所有其他数据。
澄清： YouTube API 和 oEmbed 不适合这些需求
告诉我如何使用 PHP（phpQuery 是否解决问题）或其他解决方案来解决这个问题。
经验：我连接了“Simple Html Dom Php”库，但它只适用于静态页面。
代码：我停止的解决方案
<?php
require 'simple_html_dom.php'; //подключаем библиотеку
$link = 'https://www.youtube.com/watch?v=kdmBTTAFlk0';
$html = file_get_html( $link ); // получаем страницу
$load = file_get_contents( $link );
$html= str_get_html( $load );
echo $element = $html->find('#collapsible', 0);
?>任务：
解析特定 YouTube 视频的许可证块。
为此，我连接了库“Simple Html Dom Php”
<?php
require 'simple_html_dom.php'; //подключаем библиотеку
$link = 'https://www.youtube.com/watch?v=kdmBTTAFlk0';
$html = file_get_html( $link ); // получаем страницу
$load = file_get_contents( $link );
$html= str_get_html( $load );
echo $element = $html->find('#collapsible', 0);
?>但是，它没有给出任何结果。而对其他站点的相同请求 - 有效。
您只需要解析数据。不考虑 Youtube API 和 oEmbed。
我有以下代码：
$(function() {
$('#photosUpload').fileupload({
autoUpload: false,
disableImageResize: false,
imageMaxWidth: 800,
imageMaxHeight: 800,
imageCrop: true
});
});<form id="fileupload" action="/ru/offer/addajax/" method="POST" enctype="multipart/form-data">
<input type="file" id="photosUpload" accept="image/jpg, image/jpeg, image/png" multiple>
</form>包含 jQuery File Upload 基本版本所需的所有脚本：
<script src="libraries/vendor/jquery.ui.widget.js"></script>
<script src="libraries/jquery.iframe-transport.js"></script>
<script src="libraries/jquery.fileupload.js"></script>但是，初始化失败。我已经浏览了所有文档。
我的任务是通过多项选择，文件应该缩小并作为一个整体包到达服务器。
我有这个代码：
<div class="fotorama">
<img src="images/photos/fari-ford-mustang.jpg" alt="photo1" title="title1" />
<img src="images/photos/fari-ford-mustang2.jpg" alt="photo2" title="title2" />
<img src="images/photos/fari-ford-mustang3.jpg" alt="photo3" title="title3" />
<img src="images/photos/fari-ford-mustang4.jpg" alt="photo4" title="title4" />
<img src="images/photos/fari-ford-mustang5.jpg" alt="photo5" title="title5" />
<img src="images/photos/fari-ford-mustang6.jpg" alt="photo6" title="title6" />
<img src="images/photos/fari-ford-mustang7.jpg" alt="photo7" title="title7" />
</div>启动后，网站上会出现一个方便的图像滚动滑块。
但是，在浏览器控制台中，所有 alt 和 title 属性都消失了。
<img src="images/photos/fari-ford-mustang.jpg" class="fotorama__img" style="width: 666.429px; height: 500px; left: 47.1137px; top: 0px;">网站示例：fotorama 示例
现在网站上的代码结构如下所示：
<header></header>
<div class="filterBar"></div>
<что-то></еще>
<footer></footer>
header 和 .filterBar 样式有position: sticky;
是什么让它们“粘”，最重要的是，所有后续内容都不会浮在它们下面。
由于多种原因，我发现sticky不适合我，我需要将位置标题和 .filterBar 属性替换为position: fixed;
一切似乎都很好，但接下来的街区游在他们身下。
如何使内容不浮动在具有位置的块下：固定；？！
（注：在第一张图片中游泳）
（注：在第二张 - 根据需要使用缩进）
地球上最伟大的头脑，请告诉我如何设置文件输入方法的值。
故事是为了将照片上传到测试站点，我有：
<input type="file" accept="image/*" id="uploadImg" name="tmp" value="Фотографії" multiple />
在以下方案中 生成照片预览（为用户） ：
<ul id="list">
<li>
<img src="images/photos/fari-ford-mustang.jpg" data-rank="1" />
</li>
<li>
<img src="images/photos/fari-ford-mustang2.jpg" data-rank="2" />
</li>
</ul>并输入（用于发送到服务器）到这个：
<input type="file" name="photos" data-rank="1" />
<input type="file" name="photos" data-rank="2" />用英语讲。stackoverflow 版本有一个“相同”的问题来描述它是如何工作的。
在研究了 MSDN 上的文章后，我无法以任何方式解决此任务。
有没有人在更改 input.files 的值方面有类似的经验？！
实际上我创作的整个代码：
function ShowFile(e) {
var files = e.target.files;
for (var i = 0, f; f = files[i]; i++) {
if (!f.type.match('image.*')) continue;
var fr = new FileReader();
fr.onload = (function(theFile) {
return function(e) {
$('#list').append('<li><img src="' +e.target.result+ '" /></li>').css('background-image', 'none');
$('#photoInputs').append('<input type="file" name="photos" />');
$('#photoInputs input[name="photos"]').last().files = theFile; // underfined
};
})(f);
fr.readAsDataURL(f)
}
}有一个函数，在加载脚本时，我会克服一切
$("#groups input[type=button]") // где input созданны динамически
如何使用 jQuery 找到动态创建的元素？！以前做过，只有点击或更改事件。
而且我需要在加载后立即进行搜索，而无需用户采取任何操作。
事实是，当页面加载和调整大小时，我的函数应该可以工作：
$(function () {
//...
AdaptiveFilter(); // здесь НЕ работает поиск динамических элементов
$(window).resize(function() {
AdaptiveFilter(); // здесь работает поиск д.э
});
//...
});function AdaptiveFilter() {
if ($(window).width() > 750) {
var rowWidth = $("#groups").width();
var countItems = Math.floor(rowWidth / (200 + 5));
var inputOrder = -1;
var detailsOrder = 0;
$("#groups input[type='button']").each(function() {
if (($(this).index()/2) % countItems == 0) {
inputOrder += 2;
}
else {
inputOrder++;
}
$(this).css("order", inputOrder);
});
$(".details").each(function() {
if((($(this).index()-1)/2) % countItems == 0) {
detailsOrder += countItems + 1;
}
$(this).css("order", detailsOrder);
});
$(".details").width(countItems * 200);
}
else {
$(".filterCategory").children().each(function() {
$(this).css("order", 0);
});
$(".details").width("100%");
}
}带值的参数通过 URL 来找我，我将其写入paramsURL[]数组。
然后我需要将传入的数据设置为选择的值。
$('select[name="brand"]').val(paramsURL['brand']); // этот select сгенерирован динамически. Поэтому jQ не может записать для него значение
问题： 为动态生成的元素设置值的正确方法是什么？
整个代码：
// Loading values to filter form
$('#filterName').on('click', function () { // при клике на блок
if (paramsURL['mtype'] > 0) { // проверяем есть ли значение для этого типа
$('select[name="mtype"]').val(paramsURL['mtype']).trigger('change'); // задаем его из массива и устанавливаем триггер change. Здесь работает на Отлично! Потому, что это статически создаваемый select
if (paramsURL['brand'] > 0) { // тоже самое с brand
setTimeout(function() { // сделал костыль через setTimeout
$('select[name="brand"]').val(paramsURL['brand']).trigger('change');
}, 5); // который сработает через 5мс
}
}
});这是另一个触发器 trigger('change');
$('select[name="mtype"]').change(function () {
$.ajax({
url: '/api/catalog/filter/brands?idtype=' +$('select[name="mtype"]').val(),
method: 'GET',
dataType: 'json',
contentType: "application/json;charset=UTF-8",
success: function (data) {
var brand = $('select[name="brand"]');
brand.empty();
brand.append('<option selected disabled hidden>Марка</option>');
brand.removeClass('mark');
$.each(data, function(key, val){
brand.append('<option value="' +key+ '">' +val+ '</option>');
});
},
error: function(request, status, error) {
var statusCode = request.status;
console.log(statusCode);
}
});
});带值的参数通过 URL 来找我，我将其写入paramsURL[]数组。
然后我需要将传入的数据设置为 select 的值。
$('select[name="mtype"]').val(paramsURL['mtype']);
之后， val() 会正确触发，但不会触发 select 的更改事件。
谷歌搜索，我找到了一个模拟变化的触发器->
trigger('change')
但它没有给出任何动作。也试过onchange(); - 也没有结果。仅适用于鼠标单击或输入。
input[type="range"]目标是当您将鼠标悬停在常规值上时，它会更改其值。
为此，我.mouseenter(function() {});通过 jQuery 使用了一个事件。
我附上现有的代码：
$('input[type="range"]').mouseenter( function() {
alert('Value = ' + $(this).val());
});<input type="range" name="state" min="0" max="10" value="0" />为什么单击时此代码会在 console.log 中输出过高的数量？！
var state = 0; // нужен для сохранения значения
$('input[type="range"]').on('mouseenter mousemove', function(e) {
$(this).val((e.pageX - $(this).offset().left) / ($(this).outerWidth() / 10));
console.clear(); console.log($(this).val());
$(this).on('click', function() {
state = $(this).val();
console.log(state);
});
});我在网站上有自适应广告卡（看图片）。
它们的数量和宽度取决于屏幕。
为此，我使用：以及相对于它们将拉伸display: flex; flex-grow: 1;
的钢材宽度。
在此处查看示例 ->自适应卡片width: 245px;
问题是当尺寸减小时，后续行中的元素变得不足，它们占据了整个块的宽度（看图）。
它以红色显示的地方，它现在是如何伸展的。根据需要绿色。灰色，后续卡片的空白空间。我使用：flexbox、LESS 和媒体查询。
问题是：“如何使用 flex-wrap: wrap 属性获取一行中的项目数？！”
解决方案将从何而来：max-width: calc(100% / (количество элементов в ряде));
修正
确切感兴趣：“如何找出系列中的元素数量？”
任务是删除转移！包含标题的块的高度为 28px，宽度为 100%。我试图通过它来完成，white-space: nowrap;但是当压缩时，标题为“爬上”的块到图像上。我用 flexbox制作框架。因此，如果您知道使用它们的解决方案，那将非常有帮助！
问题是jQuery.css()操作的优先级高于CSS本身。示例：我有一个CSS类.active，它使按钮在单击事件时变暗。如果 { 相邻的 :checked 块中至少有一个input[type=checkbox]，则设置$(this).next().css('background-color', '#339933'); }Else { 如果所有 ckeckbox 为空，则添加我们的类.active }。是的，也许不是最好的例子，但仍然是这样。
Py.Sy：我通过添加.mark类解决了这个问题。而不是$(this).next().css('background-color', '#339933'); }. 但问题仍然存在：“如何更改优先级”，当然除了 !important。
任务是： a）如果至少选中一个复选框，则添加 .active 类 b）如果未选中，则删除 .active 类
示例：
8-14 中有一个“汽车零件”块input[type="checkbox"]。您选择您需要的那些，然后更改值\u200b\u200band 通常取消选中所有框。