'HTML 참고서'에 해당되는 글 29건

정리 x 공부중

HTML 참고서/HTML 생활코딩 Youtube 2020. 8. 19. 00:33

###########################

# 라이브러리 사용

import tensorflow as tf

import pandas as pd

 

###########################

# 1.과거의 데이터를 준비합니다.

파일경로 = 'https://raw.githubusercontent.com/blackdew/tensorflow1/master/csv/boston.csv'

보스턴 = pd.read_csv(파일경로)

 

# 종속변수, 독립변수

독립 = 보스턴[['crim', 'zn', 'indus', 'chas', 'nox',

'rm', 'age', 'dis', 'rad', 'tax',

'ptratio', 'b', 'lstat']]

종속 = 보스턴[['medv']]

print(독립.shape, 종속.shape)

 

###########################

# 2. 모델의 구조를 만듭니다

X = tf.keras.layers.Input(shape=[13])

H = tf.keras.layers.Dense(8, activation='swish')(X)

H = tf.keras.layers.Dense(8, activation='swish')(H)

H = tf.keras.layers.Dense(8, activation='swish')(H)

Y = tf.keras.layers.Dense(1)(H)

model = tf.keras.models.Model(X, Y)

model.compile(loss='mse')

 

# 2. 모델의 구조를 BatchNormalization layer를 사용하여 만든다.

X = tf.keras.layers.Input(shape=[13])

 

H = tf.keras.layers.Dense(8)(X)

H = tf.keras.layers.BatchNormalization()(H)

H = tf.keras.layers.Activation('swish')(H)

 

H = tf.keras.layers.Dense(8)(H)

H = tf.keras.layers.BatchNormalization()(H)

H = tf.keras.layers.Activation('swish')(H)

 

H = tf.keras.layers.Dense(8)(H)

H = tf.keras.layers.BatchNormalization()(H)

H = tf.keras.layers.Activation('swish')(H)

 

Y = tf.keras.layers.Dense(1)(H)

model = tf.keras.models.Model(X, Y)

model.compile(loss='mse')

 

###########################

# 3.데이터로 모델을 학습(FIT)합니다.

model.fit(독립, 종속, epochs=1000)

 

 

##########################

# 라이브러리 사용

import tensorflow as tf

import pandas as pd

 

###########################

# 1.과거의 데이터를 준비합니다.

파일경로 = 'https://raw.githubusercontent.com/blackdew/tensorflow1/master/csv/iris.csv'

아이리스 = pd.read_csv(파일경로)

 

# 원핫인코딩

아이리스 = pd.get_dummies(아이리스)

 

# 종속변수, 독립변수

독립 = 아이리스[['꽃잎길이', '꽃잎폭', '꽃받침길이', '꽃받침폭']]

종속 = 아이리스[['품종_setosa', '품종_versicolor', '품종_virginica']]

print(독립.shape, 종속.shape)

 

###########################

# 2. 모델의 구조를 만듭니다

X = tf.keras.layers.Input(shape=[4])

H = tf.keras.layers.Dense(8, activation='swish')(X)

H = tf.keras.layers.Dense(8, activation='swish')(H)

H = tf.keras.layers.Dense(8, activation='swish')(H)

Y = tf.keras.layers.Dense(3, activation='softmax')(H)

model = tf.keras.models.Model(X, Y)

model.compile(loss='categorical_crossentropy',

metrics='accuracy')

 

###########################

# 2. 모델의 구조를 BatchNormalization layer를 사용하여 만든다.

X = tf.keras.layers.Input(shape=[4])

 

H = tf.keras.layers.Dense(8)(X)

H = tf.keras.layers.BatchNormalization()(H)

H = tf.keras.layers.Activation('swish')(H)

 

H = tf.keras.layers.Dense(8)(H)

H = tf.keras.layers.BatchNormalization()(H)

H = tf.keras.layers.Activation('swish')(H)

 

H = tf.keras.layers.Dense(8)(H)

H = tf.keras.layers.BatchNormalization()(H)

H = tf.keras.layers.Activation('swish')(H)

 

Y = tf.keras.layers.Dense(3, activation='softmax')(H)

model = tf.keras.models.Model(X, Y)

model.compile(loss='categorical_crossentropy',

metrics='accuracy')

 

###########################

# 3.데이터로 모델을 학습(FIT)합니다.

model.fit(독립, 종속, epochs=1000)

'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글

26.JavaScript Form event  (0) 2020.04.17
25.JavaScript Form event  (0) 2020.04.17
24.JavaScript load event  (0) 2020.04.17
23.JavaScript event 3  (0) 2020.04.17
22.JavaScript event 2  (0) 2020.04.17
블로그 이미지

Or71nH

,

26.JavaScript Form event

HTML 참고서/HTML 생활코딩 Youtube 2020. 4. 17. 17:19 
<html>
    <head>

    </head>
    <body>
      
      <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
      <script>
        $('body').on('click','a, li', function(event){
            console.log(this.tagName);
        })
      </script>
        <ul>
          <li><a href="#">HTML</a></li>
          <li><a href="#">CSS</a></li>
          <li><a href="#">JavaScript</a></li>
        </ul>
    </body>
</html>

이렇게 쓰면 추후에 추가되는 것들에도 함수를 넘길 수 있다

 

<html>
    <head>

    </head>
    <body>
      <input type="text" id="target" />
      <p id="status"></p>
      <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
      <script>
          $('#target').on('focus blur', function(e){
              $('#status').html(e.type);
          })
      </script>
    </body>
</html>

ㅇ이렇게 하면 포커스와 블러를 설정할수 있다 신기하다 

<html>
    <head>

    </head>
    <body>
      <input type="text" id="target"></textarea>
      <input id="remove"  type="button" value="remove" />
      <p id="status"></p>
      <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
      <script>
        var handler = function(e){
          $('#status').text(e.type+Math.random());
        };
        $('#target').on('focus blur', handler)
        $('#remove').on('click' , function(e){
          $('#target').off('focus blur', handler);
          console.log(32);
        })
      </script>
    </body>
</html>

ㅇ이해못햇음 

'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글

정리 x 공부중  (0) 2020.08.19
25.JavaScript Form event  (0) 2020.04.17
24.JavaScript load event  (0) 2020.04.17
23.JavaScript event 3  (0) 2020.04.17
22.JavaScript event 2  (0) 2020.04.17
블로그 이미지

Or71nH

,

25.JavaScript Form event

HTML 참고서/HTML 생활코딩 Youtube 2020. 4. 17. 16:52 
<html>
    <head>
        <style>
            body{
                background-color: black;
                color:white;
            }
            #target{
                width:200px;
                height:200px;
                background-color: green;
                margin:10px;
            }
            table{
                border-collapse: collapse;
                margin:10px;
                float: left;
                width:200px;
            }
            td, th{
                padding:10px;
                border:1px solid gray;
            }
        </style>
    </head>
    <body>
        <div id="target">

        </div>
        <table>
            <tr>
                <th>event type</th>
                <th>info</th>
            </tr>
            <tr>
                <td>click</td>
                <td id="elmclick"></td>
            </tr>
            <tr>
                <td>dblclick</td>
                <td id="elmdblclick"></td>
            </tr>
            <tr>
                <td>mousedown</td>
                <td id="elmmousedown"></td>
            </tr>
            <tr>
                <td>mouseup</td>
                <td id="elmmouseup"></td>
            </tr>
            <tr>
                <td>mousemove</td>
                <td id="elmmousemove"></td>
            </tr>
            <tr>
                <td>mouseover</td>
                <td id="elmmouseover"></td>
            </tr>
            <tr>
                <td>mouseout</td>
                <td id="elmmouseout"></td>
            </tr>
            <tr>
                <td>contextmenu</td>
                <td id="elmcontextmenu"></td>
            </tr>
        </table>
        <table>
            <tr>
                <th>key</th>
                <th>info</th>
            </tr>
            <tr>
                <td>event.altKey</td>
                <td id="elmaltkey"></td>
            </tr>
            <tr>
                <td>event.ctrlKey</td>
                <td id="elmctrlkey"></td>
            </tr>
            <tr>
                <td>event.shiftKey</td>
                <td id="elmshiftKey"></td>
            </tr>
        </table>
        <table>
            <tr>
                <th>position</th>
                <th>info</th>
            </tr>
            <tr>
                <td>event.clientX</td>
                <td id="elemclientx"></td>
            </tr>
            <tr>
                <td>event.clientY</td>
                <td id="elemclienty"></td>
            </tr>
        </table>
        <script>
        var t = document.getElementById('target');
        function handler(event){
            var info = document.getElementById('elm'+event.type);
            var time = new Date();
            var timestr = time.getMilliseconds();
            info.innerHTML = (timestr);
            if(event.altKey){
                document.getElementById('elmaltkey').innerHTML = timestr;
            }
            if(event.ctrlKey){
                document.getElementById('elmctrlkey').innerHTML = timestr;
            }
            if(event.shiftKey){
                document.getElementById('elmshiftKey').innerHTML = timestr;
            }
            document.getElementById('elemclientx').innerHTML = event.clientX;
            document.getElementById('elemclienty').innerHTML = event.clientY;
        }
        t.addEventListener('click', handler);
        t.addEventListener('dblclick', handler);
        t.addEventListener('mousedown', handler);
        t.addEventListener('mouseup', handler);
        t.addEventListener('mousemove', handler);
        t.addEventListener('mouseover', handler);
        t.addEventListener('mouseout', handler);
        t.addEventListener('contextmenu', handler);
        </script>
    </body>
</html>

ㅇ

이렇게 마우스의 이벤트를 확인할 수 있다

'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글

정리 x 공부중  (0) 2020.08.19
26.JavaScript Form event  (0) 2020.04.17
24.JavaScript load event  (0) 2020.04.17
23.JavaScript event 3  (0) 2020.04.17
22.JavaScript event 2  (0) 2020.04.17
블로그 이미지

Or71nH

,

24.JavaScript load event

HTML 참고서/HTML 생활코딩 Youtube 2020. 4. 17. 16:37 
<html>
    <head>
        <script>
            window.addEventListener('load', function(){
                console.log('load');
            })
            window.addEventListener('DOMContentLoaded', function(){
            var t = document.getElementById('target');
                console.log(t);
            })
        </script>
    </head>
    <body>
        <p id="target">Hello</p>
    </body>
</html>

여기서 load 는 스크립트가 문서 마즈막에 실행되게  function 을 묵고 있다가 나중에 로드해준다 

DOMContentLoaded 만이 실행되었을 때 즉 DOM실행만하고 다음에 이함수를 실행한다라는 프로그램이다 

 

 

'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글

26.JavaScript Form event  (0) 2020.04.17
25.JavaScript Form event  (0) 2020.04.17
23.JavaScript event 3  (0) 2020.04.17
22.JavaScript event 2  (0) 2020.04.17
20.JavaScript event 1  (0) 2020.04.17
블로그 이미지

Or71nH

,

23.JavaScript event 3

HTML 참고서/HTML 생활코딩 Youtube 2020. 4. 17. 15:54

기본 스크립 방식 line 방식

 

 

<html>
    <head>
        <style>
            html{border:5px solid red;padding:30px;}
            body{border:5px solid green;padding:30px;}
            input{border:5px solid black;padding:30px;}
        </style>
    </head>
    <body>
      <p>
          <label>prevent event on</label><input id="prevent" type="checkbox" name="eventprevent" value="on" />
      </p>
      <p>
          <a href="http://opentutorials.org" onclick="if(document.getElementById('prevent').checked) return false;">opentutorials</a>
      </p>
      <p>
          <form action="http://opentutorials.org" onsubmit="if(document.getElementById('prevent').checked) return false">
                  <input type="submit" />
          </form>
      </p>
    </body>
</html>

프로포트 방식

 

 

<html>
    <head>
        <style>
            html{border:5px solid red;padding:30px;}
            body{border:5px solid green;padding:30px;}
            input{border:5px solid black;padding:30px;}
        </style>
    </head>
    <body>
      <p>
          <label>prevent event on</label><input id="prevent" type="checkbox" name="eventprevent" value="on" />
      </p>
      <p>
          <a href="http://opentutorials.org">opentutorials</a>
      </p>
      <p>
          <form action="http://opentutorials.org">
                  <input type="submit" />
          </form>
      </p>
      <script>
          document.querySelector('a').onclick = function(event){
              if(document.getElementById('prevent').checked)
                  return false;
          };

          document.querySelector('form').onclick = function(event){
              if(document.getElementById('prevent').checked)
                  return false;
          };

      </script>
</html>

 

 

 

addEventListerner 방식

<html>
    <head>
        <style>
            html{border:5px solid red;padding:30px;}
            body{border:5px solid green;padding:30px;}
            input{border:5px solid black;padding:30px;}
        </style>
    </head>
    <body>
      <p>
                <label>prevent event on</label><input id="prevent" type="checkbox" name="eventprevent" value="on" />
            </p>
            <p>
                <a href="http://opentutorials.org">opentutorials</a>
            </p>
            <p>
                <form action="http://opentutorials.org">
                        <input type="submit" />
                </form>
            </p>
            <script>
                document.querySelector('a').addEventListener('click', function(event){
                    if(document.getElementById('prevent').checked)
                        event.preventDefault();
                });
                 
                document.querySelector('form').addEventListener('submit', function(event){
                    if(document.getElementById('prevent').checked)
                        event.preventDefault();
                });
     
            </script>
</html>

 

 

클릭에 관한거는 온클릭 프로포트 를 이용하는게 쉬운것 같다

'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글

25.JavaScript Form event  (0) 2020.04.17
24.JavaScript load event  (0) 2020.04.17
22.JavaScript event 2  (0) 2020.04.17
20.JavaScript event 1  (0) 2020.04.17
19.JavaScript property  (0) 2020.04.17
블로그 이미지

Or71nH

,

공지사항

카테고리

글 보관함

달력

«   2024/12   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31

티스토리툴바