簡體   English   中英

如何使用Javascript從SVG文件中提取“id”元素?

[英]How to extract "id" element from SVG file using Javascript?

我正在使用印度 SVG 地圖將其作為用戶界面交互輸入法。 我想要做的是突出顯示懸停狀態。 為此,我出於各種原因使用了 javascript 文件。 以下是我的代碼供您參考,

SVG:

<path
class="enabled"
fill="#2E0854"
 id="IN-WB"
 title="West Bengal"
 d="m 425.187,373.7723 0.59,0.56319 0.104,0.73447 -1.028,-0.2821 0.334,-1.01556 z m 7.056,-0.16825 1.44,1.15862 -1.272,0.0433 -0.168,-1.20194 z m -2.328,-0.43625 0.59,0.55413 -0.333,0.68509 -0.6,-0.50878 0.343,-0.73044 z m -3.901,-0.27202 1.053,0.82715 -0.785,0.86343 -0.838,-0.87048 0.301,-1.15056 0.269,0.33046 z m 4.913,-0.32643 0.547,1.38531 -0.965,0.33852 0.313,-0.55614 -0.516,-0.59845 0.621,-0.56924 z m 4.058,0.26094 0.399,0.45438 -0.605,0.0856 -0.085,-1.1284 0.291,0.58838 z m -7.802,-0.82413 -0.012,1.35307 -0.813,-0.50577 0.825,-0.8473 z m 8.195,-0.62364 0.132,0.93798 0.453,0.37781 0.342,0.96014 -0.603,0.0705 -0.003,-0.59039 -0.564,-0.51987 -0.462,-1.12437 0.705,-0.11183 z m -3.761,0.19847 -0.165,0.94 -0.816,-0.48662 0.981,-0.45338 z m -10.337,-0.21258 0.733,0.39998 0.251,0.9269 -0.896,0.88962 -0.088,-2.2165 z m 2.993,-0.0685 0.348,0.82011 -0.482,1.06089 -0.298,-1.15862 0.432,-0.72238 z m -5.224,-0.26598 0.253,0.46547 -0.242,0.41307 0.328,0.36069 0.063,0.53498 -0.245,0.92085 -0.642,-1.93641 0.485,-0.75865 z m 17.893,-0.0151 0.749,1.75607 -0.909,0.59644 -1.101,-1.41151 0.226,-0.55815 1.035,-0.38285 z m -10.681,0.10579 0.558,-0.12392 0.314,0.7123 -0.966,0.96921 -0.539,-1.24728 0.633,-0.31031 z m 6.993,-0.63472 1.198,1.12839 -0.407,1.42158 -1.001,-1.40344 0.21,-1.14653 z m -9.854,0.31534 0.34,0.66092 -0.364,0.97727 0.436,0.70626 -0.698,0.71734 -0.396,-1.92332 0.499,-0.80902 -0.524,-0.34053 0.345,-0.52491 0.362,0.53599 z m -4.078,-0.42012 1.035,0.17329 0.702,1.57471 -0.296,1.54651 0.413,0.53196 -0.594,0.47655 -0.713,-0.2015 -0.547,-4.10152 z m 14.994,-0.18941 0.814,0.90674 -0.902,-0.18235 0.088,-0.72439 z m -11.772,0.0322 -0.129,0.78181 0.389,0.43222 -0.487,0.3768 -0.226,-1.41754 0.453,-0.17329 z m 13.441,-0.0464 0.786,0.61054 -0.516,0.27807 -0.27,-0.88861 z m -3.74,0.0302 0.638,-0.0232 -0.547,1.16568 0.431,1.58177 -0.325,0.22165 -0.739,-0.26598 0.128,-1.60696 -0.843,0.14911 0.445,-0.93999 0.812,-0.2821 z m -5.288,-0.4564 0.789,1.08608 -0.266,0.75562 -0.646,-1.32788 0.123,-0.51382 z m 8.302,-0.10982 0.765,1.28658 -0.232,0.21661 -1.126,-1.18885 0.593,-0.31434 z m -7.727,-0.17228 0.198,0.94604 -0.368,-0.31535 -0.211,-0.48359 0.381,-0.1471 z m -2.958,0.0302 -0.025,1.16769 -0.688,0.43624 0.09,-1.13142 0.623,-0.47251 z m 5.186,-0.41711 0.902,1.0881 -0.137,0.62364 0.288,0.13601 -0.078,0.74152 -0.706,0.14609 0.397,0.62968 -1.276,-0.4443 0.166,-1.48606 0.444,-1.43468 z m -3.592,-0.0655 0.579,0.50878 0.006,1.17978 -1.11,0.36975 -0.32,-1.16668 0.845,-0.89163 z m -2.57,-0.0181 0.438,0.25288 -0.435,1.33494 -0.511,-0.97728 0.508,-0.61054 z m 12.095,-0.0131 0.354,-0.007 0.135,1.05989 -0.685,-0.56521 0.196,-0.48763 z m -3.59,0.17228 0.046,0.84429 -0.826,0.37579 0.646,-1.64625 0.134,0.42617 z m 2.372,-0.97626 0.738,0.60349 -0.251,0.73044 -1.031,0.40904 -0.266,-0.91279 0.81,-0.83018 z m -7.309,-0.0625 0.309,0.44632 -0.081,0.70424 -0.566,-0.40602 0.338,-0.74454 z m -5.435,0.12089 0.469,1.14956 0.522,0.14709 -0.063,0.44632 -0.713,0.17833 -0.162,0.806 -0.772,-0.19243 -0.398,-1.5586 1.117,-0.97627 z m 10.959,-0.46445 0.441,0.30628 0.722,2.59833 -1.421,-1.18078 0.258,-1.72383 z m -15.055,-0.22064 0.744,1.42359 -0.038,1.5717 -0.571,1.41855 0.237,0.66596 -0.954,0.54505 -1.412,-0.52591 -0.104,-0.58233 0.756,-2.37367 1.342,-2.14294 z m 13.688,0.46546 0.719,-0.80297 0.375,0.40904 -1.055,1.51729 -0.164,-0.81003 0.125,-0.31333 z m 3.94,-0.88357 1.044,0.62565 -0.267,0.93395 -1.253,-0.44733 0.476,-1.11227 z m -7.481,-0.0957 0.666,0.67301 -0.305,1.87999 -0.804,-1.78428 0.443,-0.76872 z m -1.242,0.006 0.269,0.43322 -0.422,1.20799 -0.344,-0.51181 0.497,-1.1294 z m -2.425,-0.16725 0.745,0.38688 0.169,0.70928 -0.881,0.92891 -0.937,-0.0332 0.441,-1.747 0.463,-0.24483 z m 5.628,0.11687 0.69,0.0816 0.675,0.82816 -0.477,1.76917 -1.28,-1.28557 0.392,-1.39337 z m -1.577,-0.49568 0.575,0.22668 -0.42,0.54103 -0.155,-0.76771 z m 4.115,0.0846 1.645,-0.23273 1.082,0.61256 -0.279,0.48763 -1.031,0.81809 -1.417,-1.68555 z m -2.365,-0.31736 1.588,0.27606 0.181,0.79693 -0.384,0.44531 -0.399,-0.82111 -1.084,-0.18336 0.098,-0.51383 z m 0.456,-1.08104 0.111,0.56319 0.652,0.12997 0.206,0.29519 -1.034,-0.0745 -0.389,-0.77779 0.454,-0.13601 z m -1.787,-0.89264 1.167,0.42012 -0.787,1.30673 -1.036,-0.34356 0.656,-1.38329 z m -10.857,-0.16221 -1.128,2.11776 -0.844,0.47755 0.547,-1.89107 1.425,-0.70424 z m 14.055,0.15717 1.878,0.1753 -0.12,1.68252 -0.858,0.20453 -2.031,-0.9128 0.288,-0.98634 0.843,-0.16321 z m 4.782,-0.65689 0.77,1.39236 -0.308,1.18583 -0.641,0.18941 -1.111,-2.14094 0.116,-0.77678 1.174,0.15012 z m -3.572,-0.68913 0.345,1.03067 -1.89,-0.2831 1.545,-0.74757 z m -0.608,-0.55714 0.281,0.36169 -1.328,0.37781 -0.211,0.50879 -0.499,-0.1471 0.547,-1.17776 0.757,-0.28613 0.453,0.3627 z m 0.313,-1.98376 1.24,2.285 -0.91,0.0564 -0.87,-0.88861 0.884,-0.35061 -0.703,-1.21202 0.359,0.10982 z m 2.07,0.18739 0.613,0.77174 -0.419,1.29161 -0.839,0.61458 -0.015,0.91279 0.465,0.54808 -0.236,-1.24628 0.604,-0.0423 0.185,1.56464 1.023,1.49513 -0.184,0.4443 -1.598,-0.77174 -0.493,-1.3178 -0.236,-1.60394 0.613,-0.74253 -0.771,-1.62005 0.54,0.19344 0.748,-0.49166 z m 0.975,-0.36874 1.016,1.55255 -0.269,1.47699 -1.465,-0.15918 0.613,-1.48506 -0.508,-1.25534 0.613,-0.12996 z m -6.451,0.008 1.997,0.66494 -2.217,1.99384 1.104,1.13847 -0.194,0.4967 -1.367,-0.47957 -0.57,-1.71778 1.247,-2.0966 z m 3.309,1.10925 -1.554,0.8735 -0.806,1.22814 -0.341,-0.0312 -0.418,-0.46345 2.293,-2.15 0.438,-0.0947 0.388,0.63774 z m 2.002,-1.70771 0.295,0.63473 -0.631,0.4574 -0.148,-0.41509 0.043,-0.48561 0.441,-0.19143 z m -2.824,-1.3168 0.274,0.95007 -0.57,0.35061 0.496,0.88257 -0.672,0.14206 -0.865,-0.61155 0.088,-0.53599 1.249,-1.17777 z m 0.599,-1.41251 1.054,0.0594 0.409,0.84529 0.541,0.15112 0.159,1.36214 -0.859,0.35867 0.225,1.08608 -2.129,-1.09414 0.468,-0.25994 -0.313,-2.01398 0.445,-0.49469 z m 3.004,-0.8332 -0.023,1.29464 0.831,0.63069 -0.616,0.25893 1.529,1.9888 0.036,1.15459 0.577,-0.17329 -0.719,0.60349 -0.883,-1.74801 -0.988,-0.0947 -0.367,-1.09011 0.359,-3.2381 0.264,0.41307 z m -1.904,-3.47183 -0.03,1.59184 0.614,1.44979 -0.704,0.52289 -0.52,-2.88748 0.64,-0.67704 z m 0.847,-0.54405 0.539,0.24482 0.809,2.68498 -0.819,0.44632 -0.367,2.28501 -0.725,-0.58737 -0.002,-0.94201 0.547,-0.44129 -0.578,-1.60494 0.031,-1.87294 0.565,-0.21258 z m -19.201,-107.77598 1.213,0.42517 0.229,1.39941 1.063,0.58032 1.235,-0.4564 0.772,0.38789 1.506,-0.20855 0.405,0.55815 2.264,0.54808 2.051,-1.61502 -0.192,-0.66092 0.801,-0.24986 1.257,0.0212 0.783,0.60047 0.585,-0.42013 0.84,0.98332 0.568,-0.2287 0,0 2.476,0.93092 0.105,3.70155 0.922,-1.05082 0.726,0.6589 -0.289,0.60752 0.472,0.4302 1.309,-0.37982 0.451,0.86141 0.918,0.22769 0.245,1.35609 0.607,0.66394 2.607,-0.20653 2.545,-1.16265 0.29,0.59643 1.219,0.16725 0.21,0.64883 2.085,-0.21762 1.317,0.90775 0.48,-0.0947 0.204,0.40904 -0.859,0.83219 0.393,0.20855 0.554,0.0181 0.317,-0.51483 1.101,0.42415 0.633,-0.33247 0.372,0.86645 0.687,-0.3627 1.042,0.26396 0,0 0.406,1.27449 -0.404,0.61256 0.429,0.91883 -0.325,0.14911 -0.195,2.11272 0.376,0.65387 -0.907,1.48505 0.409,-0.1471 0.219,0.42819 -1.576,0.73044 -0.024,0.52389 -0.635,0.22065 0.17,0.7526 -0.854,-0.38285 0.411,0.81003 -0.257,0.2962 -0.427,-0.269 0.501,0.74051 -0.659,0.49065 0.728,0.11586 -0.778,0.54304 0.823,0.32945 -0.322,0.20956 0,0 -0.409,-0.0544 -0.478,-0.77074 -0.065,-0.40501 -0.747,-0.20956 0.482,1.21706 -0.86,-0.0564 -0.126,0.57628 -0.394,-0.0856 0.802,0.89062 -0.761,0.42013 0.342,0.29117 0.412,-0.43323 0.419,1.01355 -1.49,0.91883 -0.023,1.30773 -0.771,-0.0544 -0.025,-0.81406 -2.174,-0.0745 -0.188,-0.86444 -0.652,0.90373 -0.962,-0.0846 -1.452,-0.8997 0.043,-0.39493 -0.493,0.0474 0.223,-0.64782 -0.88,-0.72439 -1.419,-0.3758 -0.457,-0.96619 0.132,-1.29262 -0.805,-1.09817 0.754,-0.89969 -1.116,-0.0252 0.337,-0.39998 -0.427,-0.63573 0.141,-0.77577 -1.099,0.0302 -1.605,-1.52736 -0.271,0.79592 -0.37,-0.16724 -0.471,0.56823 0.181,0.98633 0.915,0.0967 0.1,0.27001 0.482,0.0484 0.34,0.5511 -0.33,0.55917 0.868,0.44934 0.666,-0.19646 0.096,0.90372 -2.079,0.32139 -0.745,-1.09313 -0.974,-0.0766 -0.421,0.33046 0.354,0.90272 -0.802,0.10679 -0.577,-0.59442 0.05,-0.96015 -0.475,-0.29217 -0.782,0.29419 -0.259,-1.23217 -0.938,0.44128 -0.473,-1.075 0.437,-0.19041 -1.635,-1.10019 -0.08,-0.83522 -0.534,-0.0171 0.038,0.5249 -0.835,-0.17429 0.082,-0.7516 -0.721,0.16826 -0.85,-1.3964 -1.06,-0.12896 -0.42,-2.04824 -0.792,0.95209 -0.89,2.71823 0.437,0.74554 0.245,-0.96619 2.421,0.60853 0.87,2.37165 -0.791,0.24885 -0.609,-0.57427 -0.414,0.85939 -0.652,0.15516 0.192,0.33852 -1.349,0.80499 0.017,1.44072 -2.15,0.71733 -1.452,1.01858 -0.407,1.58177 0.509,0.1743 -0.255,0.88156 0.293,0.20352 -0.902,0.28612 -1.198,2.31725 0.452,0.53397 0.184,2.16612 0.724,0.53297 0.724,-0.58234 0.467,0.31031 1.284,-0.52893 0.038,0.65688 2.236,1.56968 0.599,1.00649 1.038,0.20553 -0.216,1.478 1.122,0.36471 -0.072,0.54707 1.705,1.21505 0.657,-0.17833 0.846,0.84025 1.026,0.16322 0.256,-0.62969 1.214,0.10982 -0.13,-0.67402 0.995,0.0363 0.601,1.16568 -0.465,1.42661 0.588,0.3758 -0.027,0.68711 0.941,0.92589 0.373,-0.30225 0.4,0.74152 1.793,0.25893 -1.143,0.76872 0.046,0.91984 -0.503,0.0343 0.263,0.79088 -0.51,0.39192 -1.635,-1.0216 -0.861,0.90271 -0.645,-0.43423 -0.438,0.30628 -0.896,-0.73648 -1.929,0.0806 -1.073,0.6589 -1.384,-0.78786 -1.127,0.35665 0.352,1.25837 -0.416,0.36471 0.211,1.08911 -0.342,0.673 0.361,0.33752 -1.18,1.53844 0.085,0.54204 -1.252,0.15414 -0.322,0.65588 0.452,0.42718 -0.477,0.60853 -0.999,-0.69114 -0.285,0.46949 -0.005,-0.98835 -0.745,-0.95309 -1.849,0.53901 0.753,1.73793 -0.587,0.24885 -0.24,1.03772 -0.286,-0.3768 -0.346,0.97526 -0.74,0.23071 -0.122,1.11026 -1.134,1.2624 2.873,3.71464 1.093,1.03873 1.573,0.50375 1.21,1.27952 2.416,0.14205 1.681,0.75663 0.551,1.09717 0.274,-0.69417 0.38,0.0161 0.911,0.45741 1.522,-0.10478 0.674,0.81607 -0.057,1.79032 -0.68,0.72137 0.224,1.08205 -0.325,0.12695 0.11,0.42516 0.537,-0.0232 0.033,2.33034 0.66,-0.31535 0.257,0.537 -0.754,0.15213 -0.072,1.49412 -0.616,0.003 -0.909,1.02865 -1.73,0.19042 0.539,0.98433 -0.883,0.72136 0.402,0.45841 -0.358,2.82402 0.644,0.12594 -0.242,0.8201 1.342,-0.16725 0.299,1.26643 1.752,1.64524 1.164,-0.3224 -0.158,1.22411 -0.537,-0.0333 -0.165,0.54405 0.103,1.30773 -0.603,0.35363 0.263,0.8332 -1.02,0.30527 0.48,0.99944 1.599,0.84731 0.364,-0.0222 0.079,-0.78585 0.73,0.60249 1.271,-0.12292 0.119,0.49468 1.581,-0.0917 -0.267,0.70726 -0.427,-0.19545 -0.853,1.45483 -1.063,0.68509 0.07,2.08955 -0.558,0.0433 0.444,0.29319 -0.136,0.78383 0.71,0.10579 0.387,0.7264 -0.096,0.93899 0.769,-10e-4 0.45,0.79189 -0.19,1.1012 -0.821,0.7395 0.84,1.61502 -0.561,1.63416 0.526,0.18135 -0.421,0.9279 -1.438,0.54707 -0.546,0.86242 0.32,0.60551 -0.251,2.10667 0.631,0.74857 -1.201,-0.1884 -0.4,1.7198 -1.219,1.11731 -0.11,0.73044 -1.14,-0.0856 -1.31,2.28903 0.364,1.4377 -0.795,1.59688 0.167,1.39438 -0.6,0.52692 -0.116,-0.39595 -0.669,0.0756 -0.262,1.14754 -0.707,-0.58738 0.654,-1.15459 -2.214,0.53297 -0.466,0.48158 -0.143,1.94951 -0.559,0.0252 -0.219,-1.33997 -0.833,0.22265 -1.147,0.89768 0.289,1.17071 -1.162,-0.19545 -1.129,-2.59733 0.291,-1.05485 -0.493,-0.74756 1.133,-1.43266 0.338,-1.19388 -0.437,-2.07545 -0.785,-0.72338 -2.007,-0.2962 0.739,-2.10064 -1.169,1.91727 -1.346,-0.58032 -0.548,-0.88357 -0.258,-2.75349 -0.482,-0.65487 -0.829,-0.14811 1.225,1.70469 -0.047,2.4059 1.437,1.33292 2.657,0.37781 1.116,1.93742 -2.651,1.94749 -0.192,0.0635 -1.522,3.44766 -1.07,1.29261 -0.823,0.15818 -2.096,2.22455 -0.762,-0.10578 -1.332,0.95208 -4.348,1.1012 0,0 -0.489,-0.81809 0.255,-1.40445 -0.584,-0.49368 0.015,-0.71935 -1.539,0.0191 -0.377,-0.57931 -1.878,-0.63573 -0.577,-3.17462 -1.41,-0.4302 -0.191,0.96921 -1.356,0.51181 0.023,1.075 -1.349,-0.11183 -0.676,-0.9531 0.762,-1.84775 -0.35,-1.17877 -1.264,-0.95107 -2.622,-0.26598 -0.872,-1.33191 -1.567,0.23676 0.153,-1.62509 0,0 0.927,0.0886 0.188,-0.0554 0.505,0.003 0.204,-0.55111 0.042,-0.58737 0.094,0.33147 1.451,-0.0635 0.011,-0.95209 -1.193,-0.69114 0.309,-1.62005 -1.71,-0.66193 -0.353,-1.14452 0.918,0.0262 0.196,-0.55211 -0.81,-1.67043 -2.267,-0.0766 -0.708,-2.21649 -1.646,-1.074 -0.684,0.43524 -1.894,-1.70569 0.349,-1.91021 0.633,-0.82212 -0.633,-0.60954 0.787,-0.59341 0.296,0.34557 0.708,-0.2287 0.459,-0.97828 -0.587,0.47856 -0.312,-0.53901 -1.698,-0.11083 -0.485,0.46849 -1.984,-0.88861 -1.796,0.48662 -1.307,-1.11631 -0.282,-0.96216 -1.854,-0.58233 -0.231,-0.79693 -2.553,0.32038 -1.203,-1.47799 -0.543,-0.0181 -0.109,-1.55155 1.081,-1.3843 -0.245,-0.93999 0.616,-0.13098 -0.688,-0.89969 0.066,-1.37725 1.63,0.35666 2.163,-0.89265 -0.764,-1.32687 0.756,-0.73648 2.05,0.36774 0.016,2.16611 1.579,0.39091 0.372,-0.31434 -0.295,0.77779 0.388,0.36774 0.739,-0.49267 0.45,0.48259 0.299,-0.18941 -0.296,-0.35262 1.504,-0.89063 -0.382,-0.31534 0.089,-1.06694 0.48,-0.94504 1.229,-0.56722 0.005,-0.46949 1.859,0.0151 1.318,-0.96619 2.14,-0.53498 0.792,0.0171 0.135,0.37076 1.129,-0.22367 0.58,-1.68957 -0.563,-1.61099 0.584,0.46043 1.057,-0.75361 0.084,-0.41811 0.414,-0.40199 0.866,0.80499 0.639,-0.46949 3.292,1.61199 0.515,0.0151 0.37,-0.57729 -0.743,-1.08608 1.355,0.29116 -0.148,0.3083 0.628,0.23071 0.505,0.10579 0.115,-1.8548 0.465,0.78081 0.505,-0.58737 -0.057,-1.31075 -0.635,-0.23979 -0.493,-1.72383 1.977,0.23374 -0.355,0.61055 0.262,0.19344 0.602,-0.30326 2.121,0.63774 -0.505,-0.61759 1.023,-0.12191 0.582,-0.60147 -0.404,-0.28009 0.05,-1.4518 1.729,0.68913 -0.146,-0.49368 0.804,-0.5108 -0.8,-0.61256 2.516,0.134 0.063,-0.83521 -1.148,-0.58435 -0.041,-0.71129 0.955,-0.0907 0.606,-1.04981 0.962,-0.26598 1.125,-2.37165 -0.529,-0.18236 0.799,-1.84069 -0.34,-0.37378 -0.241,0.45136 0.234,-1.24729 -0.773,-0.84428 1.649,0.70827 0.819,-0.269 0.474,-0.71835 -0.779,-0.3899 0.604,-0.0423 -0.356,-0.32442 0.604,-0.73648 -0.561,-0.35766 0.297,-1.09615 -1.278,-0.38386 -0.453,-0.64178 0.407,-0.50475 -0.048,0.56722 0.403,-0.0242 0.463,-0.67905 -0.188,-0.67704 0.645,-0.0353 -0.198,-0.65689 1.767,-1.00548 -0.144,-0.76671 -1.874,-2.27795 -2.103,-1.46389 0.231,-2.99529 0,0 1.027,0.49266 -0.29,-0.81305 0.705,-1.00749 -1.518,-1.26844 0.102,-0.92388 -0.484,-0.13299 -0.139,-0.62867 0.466,-0.91985 0.572,0.24281 0.526,-0.70626 0.62,-0.0191 0.33,-1.17575 0.414,0.27203 0.566,-0.74152 1.256,0.26497 0.013,0.51584 0.368,0.19948 0.068,-0.37982 0.42,0.56319 0.896,0.13097 0.051,-0.54405 -0.776,-0.76267 -0.308,-1.16769 0.696,-1.06795 -0.392,-0.0927 0.272,-1.25131 -1.834,-0.79391 -0.599,-1.08708 -0.71,0.0363 0.252,-1.04981 -0.568,-0.32139 0.576,-0.54002 -1.843,-0.45942 -0.399,-0.94805 0.548,-0.54405 0.255,-2.54393 1.482,-1.08608 0.381,0.51483 0.142,-0.36169 0.633,0.0725 -0.085,-1.65028 1.026,0.25993 0.51,-0.8604 0.678,0.0463 1.563,-1.80242 1.461,-0.67502 1.625,-1.69058 -0.509,-0.63774 -0.627,0.13601 -0.15,-0.43524 0.784,-0.65084 -0.814,-0.59443 -0.058,-0.68207 -0.68,0.0997 -0.309,-0.43524 1.138,-0.97929 -0.045,-0.46042 -1.318,0.34255 -0.479,0.6186 -0.822,-0.5773 0,0 0.002,-0.009 0,0 -0.017,-0.0796 0,0 1.206,-2.27291 0.575,-3.17261 -0.302,-2.2044 -0.778,-0.7798 0.203,-0.51886 -0.536,-0.69921 0.303,-0.82715 -0.889,-0.44129 -0.325,-0.73144 -0.82,-0.0292 -0.347,-1.20295 -0.618,-0.42012 0.582,-1.54349 -0.11,-1.14351 z" />

CSS:

    html, body {
  width: 100%;
}

svg {
  max-width: 100% !important;
  height: auto;
  display: block;
}

.WB:hover {
    stroke: #B3A123;
    stroke-width: 4;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.heyo:hover {
  fill: #ffffff;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.enabled {

  cursor: pointer;
}

.description {
  pointer-events: none;
  position: absolute;
  font-size: 18px;
  text-align: center;
  background: white;
  padding: 10px 15px;
  z-index: 5;
  height: 30px;
  line-height: 30px;
  margin: 0 auto;
  color: #21669e;
  border-radius: 5px;
  box-shadow: 0 0 0 1px #eee;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  display: none;
}
.description.active {
  display: block;
}
.description:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  margin-left: -10px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid white;
}

JS:

 $description = $(".description");

  $('.enabled').hover(function() {

    var valve = document.getElementById("IN-WB");
    switch(valve)
    {
        case "IN-WB": $(this).attr("class", "enabled heyo");
        break;
        default:$(this).attr("class", "enabled WB");
        break;
    }
    $description.addClass('active');
    $description.html($(this).attr('id'));
  }, function() {
    $description.removeClass('active');
  });

$(document).on('mousemove', function(e){

  $description.css({
    left:  e.pageX,
    top:   e.pageY - 70
  });

});

在 JS 文件中,我試圖獲取 ID,然后在 switch 語句下想要在其他 CSS 函數中混洗。 但是由於某種原因,當嘗試在控制台窗口中發布輸出時,它在 javascript 中顯示未定義的閥門值。

不知道 switch case,但要獲取 ID,您可以簡單地使用 $(this).attr('id');

.hover 功能是否真的有效? 因為對我來說它永遠不起作用所以我被迫使用 mouseover mouseout

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM