如何將CSS參數鏈接到javascript img？

Question

我在網頁上添加了帶有Javascript的圖像，但是我不知道如何修改或放置它。 如何將CSS鏈接到圖像，或者在沒有CSS的情況下可以對其進行修改？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>PingPongKép</title>
    <link rel="stylesheet" href="CSS/style.css">
</head>
<body>



 <script>

    function ilonaKep() {
  var img = new Image();
  img.src = 'img/ilona.jpg';
  document.body.appendChild(img);


}


    </script>

<p>Let's See the image

   <script>
    ilonaKep();
    </script>

   </p>


</body>
</html>

Answer 1

jQuery使這變得非常容易。 在圖像的style引號中將所需的任何樣式應用於圖像

<!doctype html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    </head>

    <body>
        <p> Lets see the image: </p>

        <script>
            window.onload = function(){
                addImage();

                function addImage() {
                    $('body').append('<img style="any css styling in here" src="img/ilona.jpg">');
                }
            }
        </script>
    </body>
</html>

Answer 2

Javascript可以設置元素的屬性，

img.setAttribute("style", "background-color: red;");

https://www.w3schools.com/jsref/met_element_setattribute.asp

另外，如果您不想使用內聯CSS，則可以將CSS添加到CSS文件中，並使用jquery為圖像提供一個類

$("img").addClass("myImage");

如何將CSS參數鏈接到javascript img？

問題描述

2 個解決方案

解決方案1
2 已采納 2017-10-07 17:33:50

解決方案2
1 2017-10-07 17:29:55

如何將CSS參數鏈接到javascript img？

問題描述

2 個解決方案

解決方案1 2 已采納 2017-10-07 17:33:50

解決方案2 1 2017-10-07 17:29:55

解決方案1
2 已采納 2017-10-07 17:33:50

解決方案2
1 2017-10-07 17:29:55