使jQuery成为本地JavaScript
我想将下面的jQuery修复为vanilla JS使jQuery成为本地JavaScript,javascript,jquery,Javascript,Jquery,我想将下面的jQuery修复为vanilla JS // 1⃣Disables only "a" element links contained in a particular element. $(function() { let target = //document.querySelector('.ClapLv1TextBlock_Chie-TextBlock__Text__1jsQC.ClapLv1TextBlock_Chie-TextBlock__Text-
// 1⃣Disables only "a" element links contained in a particular element.
$(function() {
let target = //document.querySelector('.ClapLv1TextBlock_Chie-TextBlock__Text__1jsQC.ClapLv1TextBlock_Chie-TextBlock__Text--SpaceOut__3kF8R').querySelectorAll('a');
$('.ClapLv1TextBlock_Chie-TextBlock__Text__1jsQC.ClapLv1TextBlock_Chie-TextBlock__Text--SpaceOut__3kF8R a');
//document.getElementsByTagName('a');
target.contents().unwrap();
});
// 2⃣Only link clicks on the "a" element contained in a particular element are disabled.
$(function() {
var target = $('.ClapLv1TextBlock_Chie-TextBlock__Text--preLine__2SRma a');
target.click((e) => {
let link = '/((\bhttps?:\/\/+?[\w=.?&\/-;#~%-]+(?![\w?&\.\/;#~%"=\+-]*>$)|\bftp:\/\/+?[\w=.?&\/-;#~%-]+(?![\w?&\.\/;#~%"=\+-]*>$)|\b\/\/+?[\w=.?&\/-;#~%-]+(\.com\/|\.co\.jp\/|www\.)+(?![\w?&\.\/;#~%"=\+-]*>$)|\bhttps?:\/\/\r?\n.+?[\w=.?&\/-;#~%-]+(?![\w?&\.\/;#~%"=\+-]*>$)))/';
e.preventDefault();
var loadContents = $(this).attr('title');
var k = '#' + loadContents;
$('#sec').load(link + k);
});
});
我真的试过了,但没能像我预料的那样修好。
关于1⃣, 似乎不仅仅是如何指定元素的问题
如果是2⃣, 它与$('a')
一起使用。
如果指定类似于document.queryselectoral('a')
的内容,则行为将完全不同。我将不经允许点击它
//1⃣Disables only "a" element links contained in a particular element.
//It doesn't work even if I replace it with "$". It seems that it is not just the problem of element specification.
(function (){
let target = //document.querySelector('.ClapLv1TextBlock_Chie-TextBlock__Text__1jsQC.ClapLv1TextBlock_Chie-TextBlock__Text--SpaceOut__3kF8R').querySelectorAll('a');
$('.ClapLv1TextBlock_Chie-TextBlock__Text__1jsQC.ClapLv1TextBlock_Chie-TextBlock__Text--SpaceOut__3kF8R a');
//document.getElementsByTagName('a');
//.contents().unwrap();
target.contentDocument.
Array.prototype.slice.call(target.contentDocument).forEach(function(el){
Array.prototype.slice.call(el.childNodes).forEach(function(child){
el.parentNode.insertBefore(child, el);
});
el.parentNode.removeChild(el);
});
})();
//2⃣Only link clicks on the "a" element contained in a particular element are disabled.
//I'm trying pure Javascript. Just change the "$" in the target element.
(function() {
var target2 = //$('.ClapLv1TextBlock_Chie-TextBlock__Text--preLine__2SRma a');
document.querySelector('.ClapLv1TextBlock_Chie-TextBlock__Text--preLine__2SRma a');
//document.querySelector('.ClapLv1TextBlock_Chie-TextBlock__Text--preLine__2SRma').querySelectorAll('a');
//document.querySelector('.ClapLv1TextBlock_Chie-TextBlock__Text--preLine__2SRma').getElementsByTagName("a");
//document.querySelectorAll('a');
//document.getElementsByTagName("a");
//document.querySelector(".ClapLv1TextBlock_Chie-TextBlock__Text--medium__3nLu4 > a");
let link = '/((\bhttps?:\/\/+?[\w=.?&\/-;#~%-]+(?![\w?&\.\/;#~%"=\+-]*>$)|\bftp:\/\/+?[\w=.?&\/-;#~%-]+(?![\w?&\.\/;#~%"=\+-]*>$)|\b\/\/+?[\w=.?&\/-;#~%-]+(\.com\/|\.co\.jp\/|www\.)+(?![\w?&\.\/;#~%"=\+-]*>$)|\bhttps?:\/\/\r?\n.+?[\w=.?&\/-;#~%-]+(?![\w?&\.\/;#~%"=\+-]*>$)))/';
target2.click((e) => {
//Disable link clicks
e.preventDefault();
for (let i = 0; i < link.length; i++) {
if (target2.innerHTML.match(link[i])) {
link[i].getAttribute('title');
var k = '#' + loadContents;
var myXml = new XMLHttpRequest();
myXml.onreadystatechange = function() {
if ((myXml.readyState === 4) && (myXml.status === 200)) {
document.querySelector('#sec').innerHTML = myXml.responseText;
}
};
myXml.open("GET", link + k, true);
myXml.send(null);
}
}
});
})();
//1⃣仅禁用特定元素中包含的“a”元素链接。
//即使我用“$”替换它,它也不起作用。似乎这不仅仅是元素规范的问题。
(功能(){
让target=//document.querySelector('.ClapLv1TextBlock\u Chie-TextBlock\u Chie-Text\u 1jsQC.ClapLv1TextBlock\u Chie-TextBlock\u-Text--SpaceOut\u 3kF8R')。querySelector all('a');
$(“.ClapLv1TextBlock\u Chie-TextBlock\uuu Text\uuuu 1jsQC.ClapLv1TextBlock\u Chie-TextBlock\uu Text--SpaceOut\uu 3kF8R a”);
//document.getElementsByTagName('a');
//.contents().unwrap();
target.contentDocument。
Array.prototype.slice.call(target.contentDocument).forEach(函数(el){
Array.prototype.slice.call(el.childNodes).forEach(function(child){
el.parentNode.insertBefore(子节点,el);
});
el.parentNode.removeChild(el);
});
})();
//2⃣只有在特定元素中包含的“a”元素上的链接单击被禁用。
//我正在尝试纯Javascript。只需更改目标元素中的“$”。
(功能(){
var target2=/$('.ClapLv1TextBlock_Chie-TextBlock_uutext--preLine_uu2srma a');
document.querySelector('.ClapLv1TextBlock_Chie-TextBlock_uutext--preLine_uu2srma a');
//document.querySelector('.ClapLv1TextBlock\u Chie-TextBlock\u Text--preLine\uu 2SRma')。querySelector all('a');
//document.querySelector('.ClapLv1TextBlock\u Chie-TextBlock\u Text--preLine\uu 2SRma').getElementsByTagName(“a”);
//文件查询选择器all('a');
//文件.getElementsByTagName(“a”);
//document.querySelector(“.ClapLv1TextBlock\u Chie-TextBlock\u Text--medium\u\u 3nLu4>a”);
(以下以下以下简称:::::::::::::::://除除以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下:::::::::::::::::::::::::::::)以下以下以下以下以下:::::::::::::::::::::::::::::::://////(以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下以下:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::+(?![\w?&\/\\/\\/\\+-]*>$)\bhttps?:\/\/\r?\n.+?[\w=。?&\/-\\/-\\/\\/\\/\\-%]+(?![\w?&\/\\\/\\\\-]*>$)/”;
目标2.单击((e)=>{
//禁用链接单击
e、 预防默认值();
for(设i=0;i
不管怎样,我只想修复1个⃣.
请告诉我。这至少部分解决了您的第一个问题:
//1。仅禁用特定元素中包含的“a”元素链接。
//jQuery:
//$(function(){$('.class1.class2 a').contents().unwrap();});
//香草JS:
document.querySelectorAll('.class1.class2 a').forEach(a=>a.parentNode.innerHTML=a.innerHTML)
- 首先要替换的是$(function(){…});您已经使用(function(){…})()完成了此操作李>
- 接下来要做的事情是替换$('.testa')。等价的是第一个结果或所有匹配结果的数组
- 要循环遍历结果数组,我们使用
- 接下来要替换的是.unwrap函数。这基本上取一个元素的,并用元素的替换
(()=>{
让target=document.queryselectoral('.testa');
forEach(t=>t.outerHTML=t.innerHTML);
})();代码>
JQuery到JavaScript
这是一个很好的例子。
那里有一些很长的类选择器。。。为什么不简化它们,把它们变小?我会在未经允许的情况下点击它是什么意思?@jqueryhtmlcs5
它被翻译了,所以可能没有被传输。我想禁用click,但是当我在原生JS中指定元素时,就会执行click。