0

我有这个用于选取框爬虫的功能，我需要在图像上添加悬停设置，但它们不是 css 文件，所以样式写在这个函数中。
我的问题是我可以在 javascript 函数中添加悬停效果吗？怎么做？
希望我的问题被理解！这是功能：

<script type="text/javascript">
       marqueeInit({
           uniqueid: 'mycrawler2',
           style: {
               'padding': '2px',
               'width': '1000',
                'background':'#9ec437',
               'height': '160px'
           },
  inc: 5, //speed - pixel increment for each iteration of this marquee's movement
  mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
           moveatleast: 1,
           neutral: 150,
           savedirection: true
       });
</script>
4

1 回答 1

0

这是我编写的一个名为 cssText 的函数 该函数将接收任意数量的对象，这些对象必须具有一个名为“selector”的属性，您也可以使用纯 CSS 传入一个字符串，但使用对象更有意义

这是一个例子：

cssText({
    "selector":"cssSelector",
    "color":"green"
});

在最底部的情况下，我在选择器上调用了 cssText 函数，该函数仅将样式应用于已悬停的所有 h1 元素 

// cssText function
cssText = (...styles) => {
        // initialize styleTag and styleString
        let styleTag = document.querySelector('style'),
            styleString = '';
        // loop through all the parameters
        for (const iterator of styles) {
            // what to do if it's an object
            if (typeof iterator == 'object') {
                // initialize properties string
                let properties = '';
                // stop entirely if there's no selector property
                if (iterator.selector == null) {
                    return;
                };
                // loop through all the properties in the object
                for (const property in iterator) {
                    // if it's not the selector add it to the properties string
                    if (property != 'selector') {
                        properties += `${property}:${iterator[property]};\n`;
                    };
                };
                // Add the entire object to the styleString
                styleString +=`\n${iterator.selector}{\n${properties}\n}\n`;
            }else {
                // Just add the plain text css if the parameter is a string
                styleString += "\n" + iterator + "\n";
            };
        };
        // If there's no style tag then add one to the head of the document
        styleTag == null ? document.head.innerHTML += `<style>${styleString}</style>` : styleTag.innerHTML += styleString;
    };
    // call the cssText function
    cssText({"selector":"h1:hover","color":"green","font-family":"helvetica"});
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

</head>

<body>
    <h1>Hello World</h1>
</body>
</html>

于 2020-08-01T20:23:07.473 回答